首页 > 解决方案 > V-表示不输出

问题描述

我对 vue.js 很陌生。

我正在尝试输出到v-for我页面上表格中间的 a ,尽管没有报告错误,但我的元素没有被呈现。

我知道我的数据正确显示在页面上,因为我可以使用 vue.js 开发工具对其进行检查。

谁能指出我做错了什么?如果控制台中报告了任何内容,我可以从那里工作,但什么也没有。

我的代码是:

<template v-for="item in dashboardData.items">
   <tr>
      <td class="position">{}{item.position}}</td>
      <td>{{item.salespersonname}}</td>
      <td>{{item.units_week1}}</td>
      <td>{{item.weeklytargetform_week1}}</td>
      <td>{{item.targetstreak}}</td>
      <td>£{{item.targetsales}}</td>
      <td>£{{item.actualsales}}</td>
      <td>{{item.points}}</td>
      <td>{{item.performancelevel}}</td>
   </tr>
</template>

我的脚本是:

<script>
$.get("https://xxxxx.co.uk/reporting/dashboards/team/detailed/week", function(
  data
) {
  var dataItems = data.items;
  var vm = new Vue({
    el: "#main",
    data: {
      dashboardData: dataItems
    }
  });
});
</script>

标签: javascriptvue.jsvuejs2

解决方案


data.items已分配给dataItems,因此调用dataItems.items有点像尝试调用data.items.items。您可以通过多种方式解决此问题,但我建议您尽早修复以恢复运行...

$.get('https://xxxxx.co.uk/reporting/dashboards/team/detailed/week', function(data) {
  var dataItems = data; 
  var vm = new Vue({
    el: '#main',
    data: {
      dashboardData: dataItems
    }
  });
});

推荐阅读