vue.js - v-for 上的 Vue 同步数据

Question

在我的模板中，我有这个元素：

<template>
  <div>
    <span v-for="item in items">{{item.name}}</span>
  </div>
</template>

在我的脚本中，我有：

import axios from 'axios';
export default {
    data: () => ({ items: null }),
    mounted: function () {
        var vm = this;
        axios.get('/items')
         .then(function (response) {
          vm.items = response.data;
        });
   }
}

我的问题是如何让<span>元素显示出来并v-for在响应返回的列表中执行items？

Answer 1

您需要spans将由创建的包装v-for在单个根中div：

<template>
  <div>
    <span v-for="item in items">{{item.name}}</span>
  </div>
</template>

而且似乎应该是一个问题vm.items = response;，有关更多详细信息vm.items = response.data;，请参见axios 响应模式。