title: How to listen to events from bootstrap-vue modal?
body: <p>I have two modals in my page and I need a way to listen to 'ok' event when pressing ok button on first modal and respond by opening the another modal.
  There are no examples in the documentation:
  <a href="https://bootstrap-vue.js.org/docs/components/modal/" rel="nofollow noreferrer">https://bootstrap-vue.js.org/docs/components/modal/</a></p>
  <p>I wanted to use this listener but nothing is explained and I couldn't find out what is what here.</p>
  <pre class="lang-js prettyprint-override"><code>export default {
    mounted() {
      this.$root.$on('bv::modal::show', (bvEvent, modalId) =&gt; {
        console.log('Modal is about to be shown', bvEvent, modalId)
      })
    }
  }
  </code></pre>
  <p>This is the relevant part of my code:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;div&gt;
      &lt;b-modal id=&quot;modal-center-add-post&quot; style=&quot;width: 120px&quot; centered  class=&quot;h-50 d-inline-block min-vw-100&quot; ok-title=&quot;next&quot; &gt;
          &lt;add-post&gt;&lt;/add-post&gt;
      &lt;/b-modal&gt;
  &lt;/div&gt;
  &lt;div&gt;
      &lt;b-modal id=&quot;modal-center-add-content&quot; style=&quot;width: 120px&quot; 
          centered  class=&quot;h-50 d-inline-block min-vw-100&quot; 
          ok-only ok-title=&quot;Create&quot; &gt;
          &lt;add-content&gt;&lt;/add-content&gt;
      &lt;/b-modal&gt;
  &lt;/div&gt;
  </code></pre>
  <p>and add-post component code is</p>
  <pre class="lang-html prettyprint-override"><code>&lt;template&gt;
      &lt;form&gt;
          &lt;div class=&quot;form-group row&quot;&gt;
              &lt;label for=&quot;title&quot; 
                     class=&quot;col-sm-2 col-form-label&quot;&gt;
                     Title
              &lt;/label&gt;
              &lt;div class=&quot;col-sm-10&quot;&gt;
                  &lt;input type=&quot;text&quot; 
                         class=&quot;form-control&quot; 
                         id=&quot;title&quot; 
                         placeholder=&quot;Title&quot;&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class=&quot;form-group row&quot;&gt;
              &lt;label for=&quot;chooseTopic&quot; 
                     class=&quot;col-sm-2 col-form-label&quot;&gt;
                     Topic
              &lt;/label&gt;
              &lt;div class=&quot;col-sm-10&quot;&gt;
                  &lt;select id=&quot;chooseTopic&quot; class=&quot;form-control&quot;&gt;
                      &lt;option selected&gt;Leadership&lt;/option&gt;
                      &lt;option&gt;HR&lt;/option&gt;
                      &lt;option&gt;Sales&lt;/option&gt;
                      &lt;option&gt;Marketing&lt;/option&gt;
                  &lt;/select&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;fieldset class=&quot;form-group&quot;&gt;
              &lt;div class=&quot;row&quot;&gt;
                  &lt;legend class=&quot;col-form-label col-sm-2 pt-0&quot;&gt; Type&lt;/legend&gt;
                  &lt;div class=&quot;col-sm-10&quot;&gt;
                      &lt;div class=&quot;form-check-inline &quot;&gt;
                          &lt;label class=&quot;form-check-label&quot; 
                                 for=&quot;video&quot; 
                                 :class=&quot;{'checked':(isChecked==='video')}&quot; 
                                 @click=&quot;isChecked='video'&quot;&gt;
                                 &lt;input class=&quot;form-check-input&quot; 
                                        type=&quot;radio&quot; name=&quot;video&quot; 
                                        id=&quot;video&quot; 
                                        v-model=&quot;postingType&quot; 
                                        value=&quot;video&quot; checked&gt;
                              &lt;i class=&quot;fab fa-youtube &quot;&gt;&lt;/i&gt;
                              Video
                          &lt;/label&gt;
                      &lt;/div&gt;
                      &lt;div class=&quot;form-check-inline&quot;&gt;
                          &lt;label class=&quot;form-check-label&quot; 
                                 for=&quot;ebook&quot; 
                                 :class=&quot;{'checked':(isChecked==='ebook')}&quot; 
                                 @click=&quot;isChecked='ebook'&quot;&gt;
                                 &lt;input class=&quot;form-check-input&quot; 
                                        type=&quot;radio&quot; 
                                        name=&quot;ebook&quot; 
                                        id=&quot;ebook&quot; 
                                        v-model=&quot;postingType&quot; 
                                        value=&quot;ebook&quot;&gt;
                                &lt;i class=&quot;far fa-file-pdf &quot;&gt;&lt;/i&gt;
                                Ebook
                          &lt;/label&gt;
                      &lt;/div&gt;
                      &lt;div class=&quot;form-check-inline &quot;&gt;
                          &lt;label class=&quot;form-check-label &quot; 
                                 for=&quot;article&quot; 
                                 :class=&quot;{'checked':(isChecked==='article')}&quot; 
                                 @click=&quot;isChecked='article'&quot;&gt;
                              &lt;input class=&quot;form-check-input &quot; type=&quot;radio&quot;  
                                     name=&quot;article&quot; id=&quot;article&quot;              
                                     v-model=&quot;postingType&quot;  value=&quot;article&quot; &gt;
                              &lt;i class=&quot;fas fa-pen-square &quot;&gt;&lt;/i&gt;
                              Article
                          &lt;/label&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/fieldset&gt;
  
      &lt;/form&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
      export default {
          name: &quot;AddPost&quot;,
          data(){
              return{
                  postingType:'',
                  isChecked:'video'
              }
          },
      }
  &lt;/script&gt;
  
  </code></pre>
  <p>So when I click on ok (next) in add-post component I want the second modal to pop up.</p>