Question

我有一个q-btn。当我单击它时，它将弹出一个模态。

<q-btn 
    @click="handler(userA)" 
    round color="primary" 
    icon="perm_identity"/>

下面的处理程序在我的数据返回对象中。

handler: (userA) => {
            console.log(`handler: ${userA}`)
            this.$q.dialog({
              title: 'Alert',
              message: '{{<buyer-info></buyer-info>}}'
            }).catch(() => {})
          }

当前，显示的消息恰好是{{<buyer-info></buyer-info>}}.我已经注册了

components: { 'buyer-info': BuyerInfo },

我的BuyerInfo组件具有<template><h1>hi</hi></template>，但是没有呈现出来。

我怎样才能在模态消息上呈现它？

Answer 1

您可以通过使用自定义对话框来实现。

<q-dialog
        v-model="customDialogModel"
        stack-buttons
        prevent-close
        @ok="onOk"
        @cancel="onCancel"
      >
        <span slot="title">Alert</span>
        <span slot="message"><buyer-info></buyer-info></span>
      </q-dialog>


methods: {
    onOk(){
      alert("hi")
    },
    onCancel(){
        alert("cancle")
    },
    handler(){
        this.customDialogModel=true
    }
  },

Vue Quasar模态放入消息中的组件

1 个答案: