vuejs 上的模态窗口



开始学习 vue js。我无法创建模态窗口。我的问题是什么?如何链接 Header.vue 组件中的按钮元素和 Modal.vue 中的模态窗口?

沙盒

我在这里编辑了你的代码,以使其工作。但是,您需要在模态本身中创建一个"关闭"按钮,以isModalLoginVisible切换回false。可以将相同的单击处理程序传递给Modal.vue以使关闭按钮正常工作。

应在公共组件(如App.vue)中调用这两个组件。在App.vue组件中创建单击处理程序,并将该处理程序作为 prop 传递给Header.vue组件。在Header.vue组件中,将单击处理程序传递给按钮@click属性。App.vue组件中的单击处理程序将切换一个标志,该标志将使用v-if指令决定Modal.vue组件是否可见。

最新更新