vue 自定义组件 双向绑定值


自定义组件

export default {
  name: 'GoodsSpec',
  components: { },
  model: {
    prop: 'value',//监听的值
    event: 'confirm'// 绑定的事件
  },
  props: {
    value: {
      type: Array,
      default() {
        return []
      }
    }
  }
}

组件的使用

<GoodsSpec v-model="spec"  />

 

值变更

1 直接给value赋值

  this.value = 'test'

2 通过$emit赋值

 this.$emit('confirm', this.url)

 

另外如果想要在使用组件时 监听值变更,并自定义处理,可以在组件上使用自定义绑定的事件

<GoodsSpec v-model="spec" @confirm="confirm" />

 

 

发布时间 : 2023-03-01,阅读量:789
本文链接:https://upwqy.com/details/230.html
vue 中基于element-ui 自定义的可输入的button 、可输入的tag 组件 站长工具