当前位置: 首页 > news >正文

uniapp中的$vm

$vm当前页面 Vue 实例 的引用,在 uni-app(基于 Vue2)里,通过 getCurrentPages() 取到的页面对象并不是 Vue 实例本身,而是一个 包含 $vm 属性的对象,这个 $vm 才是真正的 Vue 组件实例,因此:

const pages = getCurrentPages();
const prevPage = pages[pages.length - 2]; // 这是 Page 对象
const vm = prevPage.$vm;                  // 这才是 Vue 实例

为什么要用 $vm

写法作用
prevPage.$vm.xxx访问上一级页面 data、methods、computed
prevPage.$vm.someMethod(data)直接调用上一级页面定义的函数

举个完整例子

// 页面 B 返回时携带参数
const pages = getCurrentPages();
const prevPage = pages[pages.length - 2];
prevPage.$vm.receiveBackData?.({ id: 123, name: 'Tom' });
uni.navigateBack();
// 页面 A
export default {data() {return { backData: null };},methods: {receiveBackData(data) {this.backData = data;   // 拿到回传}}
}

注意

  1. 只能在 onLoad/onShow/onReady 之后才能拿到 $vm
  2. 如果你在 nvue 页面,需要用 $vm$mp.page 再包一层,写法略有差异。

一句话总结:
$vm 就是「页面级 Vue 实例」的快捷方式,方便你在页面栈里直接操作上一级页面。

http://www.lryc.cn/news/604615.html

相关文章:

  • LeetCode 56 - 合并区间
  • 7. 传输层协议 TCP
  • 关系型数据库架构最优选择:基于落霞归雁思维框架的分析
  • 15.11 单卡训练770M参数模型!DeepSpeed ZeRO-3实战:RTX 4090显存直降6.8GB
  • 10 分钟上手 Elasticsearch 语义搜索(Serverless Cloud 本地双版本教程)
  • 基因组选择育种-2.1.最佳线性无偏估计
  • GitHub使用小记——本地推送、外部拉取和分支重命名
  • RPA软件推荐:提升企业自动化效率
  • STM32学习记录--Day3
  • IPEmotion数据采集软件功能介绍
  • 【n8n】如何跟着AI学习n8n【02】:基础节点学习
  • Java面试宝典:MySQL InnoDB引擎底层解析
  • 5.Origin2021如何绘制柱状+折线双Y轴图?
  • 51单片机外部引脚介绍
  • 影视级 3D 特效的软件工具链:从概念到成片的全流程解析
  • LAMP及其环境的部署搭建
  • 逻辑回归:从线性回归到分类决策的演化
  • Spring Boot音乐服务器项目-查询喜欢的音乐模块
  • .clang-format的作用是什么,什么情况下会生效
  • 常见cms里面的几个cms框架的webshell方法(wordpress,dedecms,phpmyadmin,pageadmin)
  • 91-基于Spark的空气质量数据分析可视化系统
  • neovim 怎么调用 clang-format进行格式化
  • 常⻅CMS漏洞
  • 《Flutter篇第二章》MasonryGridView瀑布流列表
  • 算法能力提升之快速矩阵
  • python反爬:一文掌握 undetected-chromedriver 的详细使用(可通过机器人验证)
  • Flutter封装模板及最佳实践
  • git本地仓库,工作区和暂存区的知识
  • 操作系统- lecture3(进程的定义)
  • RAG:检索增强生成的范式演进、技术突破与前沿挑战