用VueJS从JSON结果中添加表行？

var app = new Vue({
  el: '#app',
  data: {
    jsonData: [] // 用于存储JSON结果的数组
  },
  methods: {
    addRow: function() {
      // 在jsonData数组中添加新的表行数据
      this.jsonData.push({ name: 'John', age: 25, city: 'New York' });
    }
  }
});

<div id="app">
  <table>
    <thead>
      <tr>
        <th>Name</th>
        <th>Age</th>
        <th>City</th>
      </tr>
    </thead>
    <tbody>
      <tr v-for="item in jsonData">
        <td>{{ item.name }}</td>
        <td>{{ item.age }}</td>
        <td>{{ item.city }}</td>
      </tr>
    </tbody>
  </table>
  <button @click="addRow">Add Row</button>
</div>