vue 封装组件 实现自定义双向绑定

当组件使用 value 实现了一个功能,但又需要实现双向绑定,这时就会有冲突。
通过 定义组件时的 model 选项,从而实现了自定义组件 v-model 功能。
类似编辑器的功能,可能用 v-model 的方式会更好,可以通过这种方式使用。

import Vue from 'vue'

const component = {
  model: {
    prop: 'value1',
    event: 'change'
  },
  props: ['value1'],
  template: `
    
`, methods: { handleInput (e) { this.$emit('change', e.target.value) } } } new Vue({ components: { CompOne: component }, el: '#root', data () { return { value: '123' } }, template: `
` })

你可能感兴趣的:(vue 封装组件 实现自定义双向绑定)