Vue配列からテーブルへの問題

Question

Vueを使用して配列データをテーブルに出力する際に​​いくつかの問題があります。誰かがvueを使って値を解析してテーブルに入れるのを助けることができますか？下のコードを参照してください。 2の配列がなければ動作しますが、レスポンスを複数にする方法がわかりません。

は、これが私の中の関数であるため、

// HTML CODE

 <tbody> 
     <tr v-for="(input, index) in inputs"> 
      <th>((input.id))</th> 
      <th>((input.tracking_number))</th> 
      <td>((input.first_name))</td> 
      <td>((input.last_name))</td> 
      <td>((input.weight))</td> 
      <td>((input.description))</td> 
      <td>((input.courier))</td> 
     </tr> 
    </tbody> 

//終了HTML

// Vueのコード

 var app = new Vue({ 
     el: '#app', 
     data: { 
     inputs: [], 
     form: { 
     scanval: null 
     } 
     }, 
     methods: { 
     updatetable() { 
     this.$http.get('someroute', {params: {page: this.form}}) 
     .then(response => { 
      if (response.body != "null") { 
      console.log(response); 
      this.inputs.push({ 
       id: response.body.id, 
       tracking_number: response.body.tracking_number, 
       first_name: response.body.first_name, 
       last_name: response.body.last_name, 
       weight: response.body.weight, 
       description: response.body.description, 
       courier: response.body.courier 
      }) 
      this.form.scanval = "" 
      } else { 
      this.form.scanval = "", 
      alert("No items found") 
      } 
     }, response => { 
      alert("no item found"); 
     }); 
    }, 

Answer 1

inputsを応答本文と同じに設定するだけです。

this.inputs = response.body 

これは応答でinputsの現在の値に置き換えられます。 OPは `Array.prototypeをを使用しているので、` inputs`が既に（いくつかのデータを持っていることをオフのチャンスで

this.inputs = this.inputs.concat(response.body)