在 Vue.js 中使用事件驱动架构更新父数据
在 Vue.js 中，双向绑定不再可用2.0 版由于已弃用。相反，采用了一种更加事件驱动的架构，其中子组件不应该直接操作它们的 props。相反，它们应该使用事件发射来与其父组件进行通信。
如果您希望从子组件更新父数据，请考虑使用带有 v-model 的自定义组件。这种特殊语法提供了与双向绑定的近似值，但使用事件来实现。
这是一个简单的示例：
<code class="javascript">Vue.component('child', {
template: '#child',
// The child has a prop named 'value'. v-model will automatically bind to this prop.
props: ['value'],
methods: {
updateValue: function (value) {
this.$emit('input', value);
}
}
});
new Vue({
el: '#app',
data: {
parentValue: 'hello'
}
});</code><code class="html"><script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.13/vue.js"></script>
<div id="app">
<p>Parent value: {{ parentValue }}</p>
<child v-model="parentValue"></child>
</div>
<template id="child">
<input type="text" v-bind:value="value" v-on:input="updateValue($event.target.value)">
</template></code>在此示例中：
以上是如何在 Vue.js 中使用事件驱动架构更新父数据？的详细内容。更多信息请关注PHP中文网其他相关文章！
