Vue回炉重造之如何使用props、emit实现自定义双向绑定

下面我将使用Vue自带的属性实现简单的双向绑定。

下面的例子就是利用了父组件传给子组件（在子组件定义props属性，在父组件的子组件上绑定属性），子组件传给父组件（在子组件使用$emit()属性定义一个触发方法，在父组件上的子组件监听这个事件）。

import Vue from ‘vueEsm’

var Com = {
name:‘Com’,
props:[‘val’],
template:<input type='text' @input='handleInput'/>,
methods: {
handleInput(e){
this.$emit(“input”,e.target.value);
}
},
}

new Vue({
el:’#app’,
data() {
return {
value:’’
}
},
components:{
Com
},

 

更多内容请见原文，原文转载自：https://blog.csdn.net/weixin_44519496/article/details/119250576