带有消息的VUE启动模态

Question

我正在尝试启动一个模态窗口，就像普通警报（）

我正在使用bootstrap-vue bmodal

1. 如何从代码生成模态类并启动
2. 或在root app.vue中添加模态并从子类中调用它。

我找到了一个示例，但无法复制-https：//codesandbox.io/embed/4l3w20zomw

Answer 1

我认为您需要使用 show()， hide()和 toggle()组件方法和此处的链接，但是这里的差异您将show()方法称为mounted()挂钩，它将在安装周期中调用ShowModal方法，因此托管应用程序时，您会看到模式如警报，示例

<template>
  <div>
    <b-modal ref="myModalRef" hide-footer title="Using Component Methods">
      <div class="d-block text-center">
        <h1>Any Content here</h1>
      </div>
    </b-modal>
  </div>
</template>
<script>
  export default {
    methods: {
      showModal() {
        this.$refs.myModalRef.show()
      },
      hideModal() {
        this.$refs.myModalRef.hide()
      }
    },
    mounted() {
     this.showModal();
    }
  }
</script>