热门IT资讯网

前端与移动开发之vue-day4(1)

发表于:2024-11-26 作者:热门IT资讯网编辑
编辑最后更新 2024年11月26日,父组件向子组件传值组件实例定义方式,注意:一定要使用props属性来定义父组件传递过来的数据 // 创建 Vue 实例,得到 ViewModel var vm = new Vue({

父组件向子组件传值
组件实例定义方式,注意:一定要使用props属性来定义父组件传递过来的数据

使用v-bind或简化指令,将数据传递到子组件中:

子组件向父组件传值
原理:父组件将方法的引用,传递到子组件内部,子组件在内部调用父组件传递过来的方法,同时把要发送给父组件的数据,在调用方法的时候当作参数传递进去;
父组件将方法的引用传递给子组件,其中,getMsg是父组件中methods中定义的方法名称,func是子组件调用传递过来方法时候的方法名称

子组件内部通过this.$emit('方法名', 要传递的数据)方式,来调用父组件中的方法,同时把数据传递给父组件使用
组件中data和props的区别评论列表案例目标:主要练习父子组件之间传值使用 this.$refs 来获取元素和组件

这是一个大大的H1


0