Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

19 实现双向数据绑定 #21

Open
xwjie opened this issue Jan 21, 2018 · 0 comments
Open

19 实现双向数据绑定 #21

xwjie opened this issue Jan 21, 2018 · 0 comments

Comments

@xwjie
Copy link
Owner

xwjie commented Jan 21, 2018

先看vue的说明自定义组件在使用 v-model 时定制 prop 和 event

自定义事件可以用来创建自定义的表单输入组件,使用 v-model 来进行数据双向绑定。要牢记:

<input v-model="something">
这不过是以下示例的语法糖:

<input
  v-bind:value="something"
  v-on:input="something = $event.target.value">

所以在组件中使用时,它相当于下面的简写:

<custom-input
  v-bind:value="something"
  v-on:input="something = arguments[0]">
</custom-input>

所以要让组件的 v-model 生效,它应该 (从 2.2.0 起是可配置的):

接受一个 value prop
在有新的值时触发 input 事件并将新值作为参数

下面这种分开写的方式,默认当前功能已经支持。

<input
  :value="something"
  @input="something = $event.target.value">

下面需要支持v-model

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant