我试图了解如何创建具有可导出函数的组件。例如:我想创建一个消息框,当我在其他组件中调用从该组件导入的showMessage()方法时,它将出现在屏幕上。在消息框组件中,我想描述逻辑和模板。如何达到这一点?非常感谢任何关于这方面的文档/文章,如果有的话。
yzuktlbb1#
1.在App.vue(或其他全局文件)中挂载消息组件,1.在商店里用功能控制它的 prop喜欢
<MyMessage :value="isOpen" :title="title" :message="message" /> ... <script setup> ... const isOpen = reactive(piniaStore().message.isOpen); const title = computed (() => piniaStore().message.title); ... </script>
// store const message = reactive({{}); // do reactive things.. const showMessage(title, _message) => { message.title = title; message.message = _message; message.isOpen = true; } ...
然后可以在任何需要的地方使用piniaStore().showMessage(...)调用消息(this代码是一个概念,如果你想正常运行,你必须开发。)但我认为你可以使用Quasar框架- Dialog($q.dialog正是你所需要的!)或Ionic framework - alert,Vuetify - dialog api等(每个框架都有这些东西)
1条答案
按热度按时间yzuktlbb1#
1.在App.vue(或其他全局文件)中挂载消息组件,
1.在商店里用功能控制它的 prop
喜欢
然后可以在任何需要的地方使用piniaStore().showMessage(...)调用消息
(this代码是一个概念,如果你想正常运行,你必须开发。)
但我认为你可以使用Quasar框架- Dialog($q.dialog正是你所需要的!)或Ionic framework - alert,Vuetify - dialog api等(每个框架都有这些东西)