Question

我正在尝试构建一个符合chartJS模型的对象

<line-chart :data="{'2017-05-13': 2, '2017-05-14': 5}"></line-chart>

我有一个API，它返回一个标准的对象数组，我将其转换为：

getData: function() {
  MyService.getData().then(res => {
    this.data = res.reduce((obj, item) => {
      obj[item.date] = item.value;
      return obj;
    }, {});
    console.log(this.data);
  });
}

来自API的结果被正确“展平”但是在Chrome中我得到了这个

{
  2018-03-05: (...),
  2018-03-06: (...),
  2018-03-07: (...)
}

起初我认为这是图表不显示的原因，但事实并非如此。

这是完整的HTML

<div class="data" v-if="data.length > 0">
  <line-chart :data="data"></line-chart>
</div>

组件的数据（）

export default {
  name: 'Graphs',
  data() {
    return {
      listOfStuff: [],
      selectedStuff: "",
      data: {}
    }
  }

Answer 1

这不是数据的问题或如何检索。由于以下行，图表不显示：

<div class="data" v-if="data.length > 0">

数据是一个对象，div从未显示过......

调用属性getter图表不显示

1 个答案: