Vue Js 子到父自定义事件
Vue Js child to parent custom event
在 Vue-js-2 cli 项目中，关于在子组件与父组件之间传输信息，我实际上遇到了很多困难。
所以我有一个弹出模式，当数据为真时出现
<component v-if="profile" />
这个弹出窗口包含我的子组件（个人资料页面）现在我应该如何关闭这个弹出窗口？
我在其中添加了一个小的“十字图标”，所以我需要在 click 事件 上告诉父 this.profile = false
我确定我需要在 $emit 事件中执行此操作，但不明白如何在自定义子事件中修改来自父项的数据...
感谢您的帮助！
有两个选项可以完成您的需要：
选项 1：v-model
可以参考v-model
<component v-model="value">
这相当于（在大多数情况下）
<component v-bind:value="data" v-on:change="data = $event">
选项 2：v-bind：value.sync
如何sync modifier of v-bind实现two-way数据传输。
但实际上，这些表达式是事件处理的语法糖
<component v-bind:value.sync="data">
相当于
<component v-bind:value="data" v-on:update:value="data = $event">
在 Vue-js-2 cli 项目中，关于在子组件与父组件之间传输信息，我实际上遇到了很多困难。
所以我有一个弹出模式，当数据为真时出现
<component v-if="profile" />
这个弹出窗口包含我的子组件（个人资料页面）现在我应该如何关闭这个弹出窗口？
我在其中添加了一个小的“十字图标”，所以我需要在 click 事件 上告诉父 this.profile = false
我确定我需要在 $emit 事件中执行此操作，但不明白如何在自定义子事件中修改来自父项的数据... 感谢您的帮助！
有两个选项可以完成您的需要：
选项 1：v-model
可以参考v-model
<component v-model="value">
这相当于（在大多数情况下）
<component v-bind:value="data" v-on:change="data = $event">
选项 2：v-bind：value.sync
如何sync modifier of v-bind实现two-way数据传输。 但实际上，这些表达式是事件处理的语法糖
<component v-bind:value.sync="data">
相当于
<component v-bind:value="data" v-on:update:value="data = $event">