BootstrapVue - 页面加载后显示 b-modal答案

【问题标题】：BootstrapVue - Show b-modal after page loadingBootstrapVue - 页面加载后显示 b-modal
【发布时间】：2020-11-09 17:47:39
【问题描述】：

我想在新页面的模态框上使用该设计，但我不想单击按钮来显示模态框。我得到了这样的基本代码：

<b-modal id="modalPopover" title="Modal with Popover" ok-only>
    <p>
      This
      <b-button v-b-popover="'Popover inside a modal!'" title="Popover">Button</b-button>
      triggers a popover on click.
    </p>
    <p>
      This <a href="#" v-b-tooltip title="Tooltip in a modal!">Link</a> will show a tooltip on
      hover.
    </p>
</b-modal>

我尝试添加诸如 v-show="true"、show="true" 或 @show 之类的属性，但对我没有任何帮助。有人能解决我的问题吗？

【问题讨论】：

标签： vue.js vue-component bootstrap-vue

【解决方案1】：

您可以使用visible 属性，将其设置为true，它会在自动挂载时显示。

<b-modal visible>
  <!-- Content -->
</b-modal>

【讨论】：

【解决方案2】：

您可以使用组件方法show()在mounted hook中完成，并通过ref访问modal：

<b-modal 
    ref="mymodal"
    // other props...
></b-modal>

还有：

mounted(){
    this.$refs.mymodal.show()
}

【讨论】：