1. ref 获取dom元素,除了能获取dom元素也能获取组件dom,
组件通信:
在父组件中直接调用ref定义的组件的数据或者方法
<div id="app"> <p ref="mybutton"></p> <div ref="mybutton"></div> <!-- 会覆盖 --> <!--遇见循环 输出是一个数组--> <template v-for="i in 3"> <div ref="mybutton">ww</div> </template> <my-button ref="myComponent"></my-button> </div> <script src="./node_modules/vue/dist/vue.js"></script> <script> let vm = new Vue({ el:"#app", mounted(){ console.log(this.$refs.mybutton); console.log(this.$refs.myComponent); console.log(this.$refs.myComponent.msg); //获取组件的数据 this.$refs.myComponent.fn(); //获取组件的元素和方法 }, components:{ "my-button":{ template:"<div>myYilia</div>", data(){ return { msg:"1212" } }, methods:{ fn(){ console.log("121"); } } } } }); </script>
原文地址:https://www.cnblogs.com/moon-yyl/p/11754674.html
时间: 2024-11-09 06:08:04