vue如何自我封装一个 textarea 实现 v-model

Question

想实现一个这样的功能 textarea 下面永远跟上和 textarea 相同的文字

parent.vue
<my-textarea v-model="desc"></my-textarea>
export default{
     data(){
        return {
            desc:'描述'
        }
     }
}

mytextarea.vue
<template>
    <textarea @input="input" :value="value"></textarea>
    <span>{{value}}</span>
</template>
export default{
   props: {
        value: {
          default: ""
        },
    },
    methods:{
        input(){
            this.$emit('input',event.target.value)
        }
    }
}

实现方式大概是这样,但是发现 span 中的 value 并不会变化....请教大佬们有什么好的方案!!!

Answer 1

mytextarea中的value值没有传到parent里面去，建议参考官方文档，父子组件传值