vue2 子传父，父传子,v

子传父，父传子,v"/>

vue2 子传父，父传子,v

父传子

在components里面创建子组件aaaChild.vue

//子组件
<aaa-child :list="list" @add="add"></aaa-child>data() {return {list:[{name:'小明',age:18},{name:'小红',age:16}]}}

子传父

父

//设置自定义事件
<dyx-child @add="add"></dyx-child>//val是子组件传过来的值methods: {add(val){console.log(val);}},

子

//随便设置一个事件
<button @click="add">点击</button>//用this.$emit()向父组件传值  第一个是绑定父组件的自定义事件  第二个是传递的值methods: {add(){this.$emit('add','12312312' )}}

 v-model 双向绑定

父

//自定义事件
<aaa-child v-model="name" @blurs="blurss"></aaa-child>//v-model绑定的数据data() {return {name:"123456"}}//自定义事件methods: {blurss(){console.log(this.name);}}

子

//用:value绑定数据  双向绑定需要用到@input
//@blur="blurs" 是失去焦点的事件
<input type="text" :value="value" @input="inputChange" @blur="blurs">//接受过来的数据用valueprops:{value:String}methods: {inputChange(e){this.$emit('input', e.target.value)},
//失去焦点事绑定父组件的自定义事件blurs(){this.$emit("blurs")}}