首页 > 解决方案 > 使用 vue js 首次单击时 bootstrap 4 模态不会打开

问题描述

当我按下按钮时,我的 bootstrap 4 模式没有显示,但我的计算属性是用于触发的(来自控制台)

这是我的模板代码

<form>
    <!-- button that triggers the modal -->
    <div id="btnBereken">
      <a
        class="btn btn-success btn-lg"
        data-target="#exampleModal"
        v-on:click="Vali"
        v-bind:data-toggle="Validation"
      >Bereken</a>
    </div>
  </div>
</form>
<!--modal itself-->
<div
  class="modal fade"
  id="exampleModal"
  tabindex="-1"
  role="dialog"
  aria-labelledby="exampleModalLabel"
  aria-hidden="true"
  v-show="Ok"
></div>

这是我的脚本代码我有一个方法和一个计算属性链接到data-toggle我的按钮

Vali: async function(){
  this.Ok =true;
}

和我的计算属性

Validation() {
  if (this.Ok) {
    console.log("getriggerd");
    return "modal";
  }
}

当我按下按钮时,弹出不会触发但第二次触发,并且我的值this.Ok在我的控制台和 VueJS 开发工具中得到更新

标签: vue.jsbootstrap-modal

解决方案


推荐阅读