好资源导航 » 文章资讯 » vue组件父与子通信详解（一）

vue组件父与子通信详解（一）

2023-09-21 11:11:06 57

本文实例为大家分享了vue组件父与子通信的具体代码，供大家参考，具体内容如下

一、组件间通信（父组件 --> 子组件）

步骤：

①父组件在调用子组件传值

②在子组件中获取父组件传来的值

Vue.component('child-component',{
props:['myValue'],
template:''
})

代码1：





父传子




{{msg}}

myValue是属性名，必须都一样……拿data中的用v-bind:或者：
props是property属性,是个数组

代码2：





父子之间通信练习




{{msg}}

代码3：

要拿到data中的数据就要v-bind,否则就不用。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。