如何根据文本框上的指定数字添加行 vue.js

Question

大家好，我是使用 vue.js 制作应用程序的新手我想知道如何根据文本框上的指定数字添加行。

这是我的 fiddle

script

    var evaluate  = new Vue({
  el: "#evaluate",
  data: {
    rows: [
    ]
  },
  methods:{
    addRow: function(){
      this.rows.push({});
    },
    removeRow: function(row){
      //console.log(row);
      this.rows.$remove(row);
    }
  }
});

Answer 1

您可以使用 v-model 检索输入框的值，然后只需推送那么多新行：

HTML

<input type="text" v-model="rowCount" name="rows" class="rows-textbox">

JS

data: {
    rowCount:0,
    rows: [
    ]
  },
  methods:{
    addRow: function(){
      for(i = 0; i < this.rowCount; i++){
        this.rows.push({});
      }
      this.rowCount = 0;
    },
  }

Fiddle

如何根据文本框上的指定数字添加行 vue.js

How to add rows base on the specified number on textbox vue.js

javascript

jquery

vue.js