首页 > 解决方案 > Bootstrap-vue 从模态打开模态

问题描述

有没有办法在 bootstrap-vue 中从另一个模态打开一个新模态?

<div>
  <b-btn v-b-modal.modal1>Launch demo modal</b-btn>
  <b-modal id="modal1" title="Bootstrap-Vue">
    <b-btn v-b-modal.modal2>Launch another modal</b-btn>
    <b-modal id="modal2" title="Bootstrap-Vue">
      Vueception
    </b-modal>
  </b-modal>
</div>

当我在https://bootstrap-vue.js.org/play上运行此示例时,它将打开第一个模式,但是当我单击按钮打开第二个模式时,它将导致第一个模式关闭。

标签: vue.jsbootstrap-vue

解决方案


您只需要重新排序您的组件,以便按钮位于第一个模式内,但第二个模式应该在外部,这样它就不会被第一个模式关闭..

<div>
  <b-btn v-b-modal.modal1>Launch demo modal</b-btn>
  <b-modal id="modal1" title="Bootstrap-Vue">
    <b-btn v-b-modal.modal2>Launch another modal</b-btn>
  </b-modal>
  <b-modal id="modal2" title="Bootstrap-Vue">
    Vueception
  </b-modal>
</div>

检查这个工作示例


推荐阅读