Question

根据我们选择的bootstrap panels的值显示我{3} select：

<div class="panel panel-default">
 <Select/>
</div>
<div class="panel panel-default" v-if="fileMode == 0"></div>
<div class="panel panel-default" v-else-if="fileMode == 1"></div>
<div class="panel panel-default" v-else>
 <div class="form" id="uploadCsvForm"/>
</div>

JS：

  mounted() {
    var self = this;
    this.$nextTick(() => {
      $("#uploadCsvForm").submit(function(e) {
         e.preventDefault();
         self.uploadCsvAndGetData();
         return true;
      });
    });
  },

因此，隐藏并显示具有该表单的面板后，$("#uploadCsvForm").submit(function(e)不再起作用... 你知道为什么吗？

谢谢

Answer 1

这是因为删除了div并且丢失了事件处理程序绑定。尽量不要将Vue与jQuery混合使用。这样的事情会更好：

<div class="panel panel-default">
 <Select/>
</div>
<div class="panel panel-default" v-if="fileMode == 0"></div>
<div class="panel panel-default" v-else-if="fileMode == 1"></div>
<div class="panel panel-default" v-else>
 <div class="form" @submit="uploadCsvAndGetData"/>
</div>

在隐藏并显示引导面板后，Vue.js表单提交不起作用

1 个答案: