vue ref调用子组件方法.docxVIP

vue ref调用子组件方法 Vue 可以使用 ref 特性来调用子组件的方法。ref 指的是可以在 HTML 标记中绑定的一个属性，它的值可以是字符串，也可以是一个对象引用，在渲染 HTML 之前，Vue 会把 ref 指令对应的内容封装成一个对象，生成它们之前，它会传递给子组件，那么就具备调用子组件方法的条件了，子组件就通过 props 拿到这个方法，就可以使用 this.$refs 调用这个方法了。实际上，ref 指令也可以用于调用非组件实例的方法，而且可以调用原生 DOM 元素上的方法，但更多的是用于调用子组件的方法。 使用 ref 调用子组件的方法的具体流程如下： 1.在 Vue 模板里，使用 ref 指令在子组件实例上添加一个属性，赋予可以捕获它引用的值，如： Child ref=child/ 2.在父组件里，可以通过 this.$refs 访问子组件实例中定义的 ref 属性，如： this.$refs.child 3.在子组件里，添加一个方法，用于父组件调用，如： methods: { getData () { // 做获取数据的操作 } }