两个网站做响应式网站,免费网站建设程序下载,社群运营,瑞金建设局网站在实际中工作#xff0c;我们经常需要使用 el-dialog 来做一个弹框的功能。最常见的就是在父组件中点击一个按纽#xff0c;然后弹出一个框。而这个框就是子组件。同时#xff0c;父子组件是分布在不同的文件中。
!--父组件--
template div …在实际中工作我们经常需要使用 el-dialog 来做一个弹框的功能。最常见的就是在父组件中点击一个按纽然后弹出一个框。而这个框就是子组件。同时父子组件是分布在不同的文件中。
!--父组件--
template div button clickdialogVisible true打开对话框/button ChildDialog v-modeldialogVisible / /div
/template script
import ChildDialog from ./ChildDialog.vue; export default { components: { ChildDialog }, data() { return { dialogVisible: false }; }
};
/script!--子组件--
template el-dialog v-bind$attrs v-on$listeners titleDialog Title !-- 对话框内容 -- /el-dialog
/template script
export default { inheritAttrs: false, // 这将阻止默认的属性绑定class 和 style 除外因为我们已经使用了 $attrs // 不需要额外的 props、data 或 watch因为 $attrs 已经包含了所有需要的东西
};
/script核心的代码就是这样大家可以放到自己的项目中直接使用即可。