vue自定义组件上的v-model如何与子组件数据绑定

v-model父组件写法:

<ani @getValue="consoleValue" v-model="show"></ani>
<ani v-model="show">
  <h3 slot="h2">我是插槽</h3>
</ani>

v-model子组件写法

export default {
        name: "ww",
        props: {
            show: {
                type: Boolean,
            }
        },
      //prop代表着要和props的那个变量相对应
      //event表示着事件,触发事件getValue的时候会改变父组件v-model的值。
        model:{
          prop: 'show',
          event: 'getValue'
        },
        components:{
            CellGroup, Cell
        },
        methods: {
            getShow() {
                // eslint-disable-next-line no-console
                console.log(this.show);
            },
            tellValue(){
                this.$emit('getValue', false)
            }
        },
    }
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容