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

Question

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

<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 之类的属性，但对我没有任何作用。有人可以解决我的问题吗？

Answer 1

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

访问模式

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

并且：

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

Answer 2

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

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

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

BootstrapVue - Show b-modal after page loading

vue.js

vue-component

bootstrap-vue