vue自定义组件v-model的使用

289 阅读1分钟
子组件使用 props 中的 value 属性,接收父组件传过来的值

props: ['value']

data 中定义一个变量对应实际变化的数据,如:content,并将 value 的值赋给 content,代码如下: 

data: () => {  
    return {    
        content: this.value  
    } 
} 

对应内容更改时,使用 $emit将值反馈给父组件,代码如下:

watch: {
    content:function(newVal, oldVal) { 
        this.$emit('input', newVal)    }
} 

当然内容变化的触发点可以自己定义,接下来就可以在父组件直接使用 v-model 了 

<sub v-model="message"></sub> 


不积跬步,无以至千里。每天进步一小点点......