通过父子传值的方式控制dialog显示隐藏

MagnumHou 2023-01-13 03:23:04

课时名称	课时知识点
通过父子传值的方式控制dialog显示隐藏	通过父子传值的方式控制dialog显示隐藏

...全文

126 回复打赏收藏转发到动态举报

写回复

回复

切换为时间正序

请发表友善的回复…

发表回复

主要介绍了解决父组件将子组件作为弹窗调用只执行一次created的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧

子组件向父组件传值实现子组件控制父组件dialog的显示子组件：child.vue <template> <div @click="add"></div> </template> methods: { add() { //触发showDialog，所传的值为false this.$emit('showDialog',false); } } 父组件： <template> //监听子组件触发的sh

vue3 el-dialog 子组件弹窗父组件控制显隐

vue 父子传值 props v-model

在Vue3中，我们可以通过provide和inject来实现父子组件之间的数据传递，这也适用于实现弹框功能。下面是一个简单的例子：在父组件中，我们定义了一个变量来控制弹框的显示与隐藏，以及对应的方法来打开和关闭弹框。同时，我们将要展示的弹框作为父组件的子组件嵌入到模板中，并将visible属性绑定到变量上，这样在弹框中也可以使用它来控制弹框的显示与隐藏。在子组件中，我们定义了一个visible属性来控制该弹框的显示与隐藏。同时，我们使用了inject来注入父组件中定义的close。

橙汐工作室

3

社区成员

332

社区内容

发帖

与我相关

我的任务

vue.js前端框架html5 企业社区天津·河西区

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

核心使命：为IT从业者和技术爱好者提供一个优质的学习、交流和分享平台，促进技术创新和成长。
注意事项：请保持尊重、友善的交流环境，遵守社区规则，禁止发布违法、侵权、低俗或有害信息。
激励机制：为了鼓励积极参与社区的用户，我们会设置积分和勋章系统，支持高质量的原创内容和有益的互动。
感谢您的加入，期待与您一起在CSDN社区共同探索技术，交流经验，共同成长！

试试用AI创作助手写篇文章吧

+ 用AI写文章