vue下面自定义组件使用v-model

起始v-model就是v-bind:value + 'input'事件的语法糖,使用v-model来进行双向数据绑定的时:


// 等效于====>

如果自定义组件的v-model要生效,就是这两点:

  • 接受一个 value 属性
  props: {
  // 一定要一个value的prop
    value: {
      type: String,
      required: false
    },
  },
  • 在有新的value时触发input事件
      this.$emit("input", changeInfo);

下面的例子我是基于element-ui的select,和后台接口有点查询的交互,在选择的时候,也是就是el-select发出@change事件的时候,把选中的内容发出去,这样就把自定义组件弄好了双向绑定了。



你可能感兴趣的:(vue下面自定义组件使用v-model)