我一直在阅读有关v-model的帖子，但是到目前为止，教程一直令人困惑，并且没有真正回答我的问题：您如何与v-model实现双向数据绑定？p>我需要将数据变量绑定到子组件，并能够从父侧和子端更改变量的值。我需要放入哪个代码中的子组件，所以当我进行<Component v-model="var">时，我可以从双方更新var？
为此，我希望避免使用商店模式，因为它只是两个需要共享数据的组件。
v-model只是单向数据流的基础上的抽象。本质上，您的自定义子部分需要做两件事：
- 接受A Prop 命名
value。 - 发出一个名为
input的事件。
因此，您的孩子组成部分将像这样使用：
<child-component :value="myVal" @input="myVal = $event"></child-component>
在上述代码中，$event是一种特殊的模板构造，它保存了儿童组件作为事件有效负载的一部分发出的数据。@input事件只是简单地更新 myval 值，该值将通过:value绑定再次传递给子组件，从而单向数据流。
现在，这种模式重复了很多次，以至于vue.js提供了一个简单的 v-model语法 - sugar，可以使用，而不是上述代码。
<child-component v-model="myVal"></child-component>
另外，如果出于某种原因，您不想使用value或input作为您的道具和事件，则可以使用model属性更改它们。这是为此的其他文档。
请注意，如果您使用的是redux/vuex，则避免使用v-model。对于嵌套数据，您很有可能会在边缘场景中登陆。
在更改儿童组件中的输入时要修改默认行为时，不可能将v-model用于双向数据绑定。
您想使用v-bind显示值，然后v-on:input将数据传递回父组件。
请参阅https://codesandbox.io/s/rj76y5w02o。例如。
第一行只是只读文本。SELECT下拉列表是父侧数据突变器，文本框来自子组件。
基本上，您希望将数据保存在父侧，并将数据传递给使用道具的子组件。在子组件中，您想将输入事件传递给父母，以使用$emit。
通过父级下拉更改值将更新值。从子组件的文本输入中更改值。如果您输入one，two或three，则父会选择下拉将相应更新。
对于您而言，您可以使用.sync修饰符。https://v2.vuejs.org/v2/guide/components-custom-events.html#sync-modifier