model

2.2.0 新增

  • 类型{ prop?: string, event?: string }

  • 详细

允许一个自定义组件在使用 v-model 时定制 prop 和 event。默认情况下,一个组件上的 v-model 会把 value 用作 prop 且把 input 用作 event,但是一些输入类型比如单选框和复选框按钮可能想使用 value prop 来达到不同的目的。使用 model 选项可以回避这些情况产生的冲突。

  • Example
  1. Vue.component('my-checkbox', {
  2. model: {
  3. prop: 'checked',
  4. event: 'change'
  5. },
  6. props: {
  7. // this allows using the `value` prop for a different purpose
  8. value: String,
  9. // use `checked` as the prop which take the place of `value`
  10. checked: {
  11. type: Number,
  12. default: 0
  13. }
  14. },
  15. // ...
  16. })
  1. <my-checkbox v-model="foo" value="some value"></my-checkbox>

上述代码相当于:

  1. <my-checkbox
  2. :checked="foo"
  3. @change="val => { foo = val }"
  4. value="some value">
  5. </my-checkbox>