Asp.net mvc 引导模式按钮单击不使用单击事件触发

我在使用Vue JS的.Net MVC Razor页面中使用bootastrap模式 模式弹出窗口由按钮点击事件启动，如下所示

<div>
    <button type="button" class="btn"  v-on:click="rejectModal(item)">Reject Popup</button> 
</div>


rejectModal: function (item) {
  this.selectedItemReject = item; //set a property 
  console.log(this.selectedItemReject);
  $('#declineModal').modal('show'); //show modal
},

拒绝弹出窗口
拒绝模式：功能（项目）{
this.selectedItemReject=item；//设置属性
console.log（this.selectedItemReject）；
$（'declinemodel'）.model（'show'）；//show model
},

这显示了输入注释的弹出窗口和文本区域，当我试图单击SAVE按钮时，click事件似乎没有触发。我计划将notes属性添加到selectedItemReject对象，并继续进行ajax调用，并在单击保存按钮时隐藏弹出窗口。但不知道为什么按钮点击事件会触发

<div class="modal fade" id="declineModal" tabindex="-1" role="dialog" aria-labelledby="declineModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="declineModalLabel">Decline Note</h4>
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            </div>
            <div class="modal-body">
                <textarea name="decline-notes" v-model="rejectNote" placeholder="Add a note..."  rows="4" class="form-control"></textarea>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button  class="btn btn-primary"  v-on:click="reject">SAVE</button>
            </div>
        </div>
    </div>
</div>



reject: function () {
  console.log("reject"); // NOT FIRING 
  }

谢票
&时代；
接近
拯救
拒绝：函数（）{
console.log（“拒绝”）；//不触发
}

---

根据一些建议，已经尝试从“关闭”按钮中删除数据dislose=“modal”，但没有区别，代码看起来不错。您可以在控制台中检查错误。还要确保创建生成并硬刷新浏览器以使缓存无效。原因是模式DIV不在VueJS应用程序的范围内。Vue JS应用程序是为根div定义的，我将modal div移到了根div中，一切都恢复正常