vue $emit bug
https://www.cnblogs.com/xgqfrms/p/11146189.html
solution
https://forum.vuejs.org/t/emit-not-working/14680/2
watch & lowcase
parent component
child component
vue &$emit
event bus
https://www.telerik.com/blogs/how-to-emit-data-in-vue-beyond-the-vuejs-documentation
https://blog.logrocket.com/using-event-bus-in-vue-js-to-pass-data-between-components/
vue & watch
deep: true,
https://juejin.im/post/5b3cd8355188251b105ad14b
modal demo
<!-- modal -->
<FormModal
:dialogFormVisible="dialogFormVisible"
:dialogFormData="dialogFormData"
@close-put-item="closePutItem"
@save-put-item="savePutItem"
/>
<!-- <FormModal
:dialogFormVisible="dialogFormVisible"
:dialogFormData="dialogFormData"
:closePutItem="closePutItem"
:savePutItem="savePutItem"
/> -->
methods: {
init() {
//
},
closeForm() {
// this.visible = false;
console.log(`close modal`);
// this.$emit(`closePutItem`);
// this.$emit(`close-putItem`);
this.$emit(`close-put-item`);
},
saveForm() {
// this.visible = false;
console.log(`save form`);
// this.$emit(`savePutItem`, {abc: 123});
this.$emit(`save-put-item`, {abc: 123});
},
},
mounted() {
this.init();
this.visible = this.dialogFormVisible;
},
created() {
this.visible = this.dialogFormVisible;
// const {
// dialogFormVisible,
// dialogFormData,
// } = this;
// this.visible = this.dialogFormVisible;
// this.form = dialogFormData;
},
watch: {
dialogFormVisible(newProp, oldProp){
console.log(`newProp, oldProp`, newProp, oldProp)
this.visible = newProp;
}
},
refs
©xgqfrms 2012-2020
www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！