BootstrapVue：如何在单击按钮时关闭弹出窗口/表单

new Vue({
  el:"#app",
  data: () => ({ isRegisterFourth: true }),
  methods: { 
    hideModal() {
      this.$refs.modal1.hide();
    },
    resetNow() {} 
  }
});

<link type="text/css" rel="stylesheet" href="https://unpkg.com/bootstrap/dist/css/bootstrap.min.css"/>
<link type="text/css" rel="stylesheet" href="https://unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.css"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.min.js"></script>
<script src="https://unpkg.com/babel-polyfill@latest/dist/polyfill.min.js"></script>
<script src="https://unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.js"></script>

<div id="app">
  <div>
    <b-button 
      class="button-self" 
      v-on:click="resetNow" 
      v-b-modal.modal-1
    >Register</b-button>
 
    <b-modal ref="modal1" id="modal-1" title="" class="modal-dialog modal-lg fade main-pop">
      <div class="modal-content">
        <div class="right-source" v-if="isRegisterFourth">
          <div class="proceed-section">
            <div class="icon-err"/><div class="get_back-img"></div>
            <div>
              <button 
                type="button" 
                class="btn btn-secondary goto-home-err" 
                @click="hideModal"
              ><b>OK!</b></button>
            </div>
          </div>
        </div>
      </div>
    </b-modal>
  </div>
</div>