向表单添加输入

时间:2017-11-20 22:11:54

标签: vue.js

我使用VueJS让它在点击按钮后动态添加新输入。使用我当前的代码,它不会添加输​​入。那是为什么?

<div class="row" v-for="count in task.pos.length">
    <div class="col-12 col-sm-6">
        <div class="form-group">
            <label class="control-label" for="po_number">Order Number:</label>
            <input id="po_number" class="form-control" type="text" placeholder="Purchase Order" v-model="task.pos[count-1].purchase_order">
        </div>
     </div>
     <div class="col-12 col-sm-6">
         <div class="form-group">
             <label class="control-label" for="po_amount">Order: Amount:</label>
             <input id="po_amount" class="form-control" type="text" placeholder="Purchase Amount" v-model="task.pos[count-1].po_amount">
          </div>
     </div>
  </div>
  <div class="form-group">
      <button class="btn btn-success btn-xs mb5 text-white" v-on:click.prevent="addEditNewPOEntry()"><i class="fa fa-plus"></i> Add PO</button>
      <button class="btn btn-warning btn-block btn-xs" v-on:click.prevent="saveEdit(task)">Done</button>
  </div>


addEditNewPOEntry: function(){
    this.newTask.po.push({'purchase_order': this.task.purchase_order, 'purchase_amount': this.task.purchase_amount});
    this.$set(this, 'task.pos.length', this.task.pos.length+1);
},

0 个答案:

没有答案