使用 axios 显示 json 的结果

Question

您好，我正在尝试使用 vue.js 显示 json 文件结果，目标是结果将显示在值上。

这是我的代码：

    data () {
            axios.get('http://localhost:3000/statcard').then(response => {
            this.items = response.data;
            this.items.forEach(item => {
            this.statsCards.push({ type: 'warning', icon: 'ti-server', title: 'Cases', value: item, footerText: 'Updated now', footerIcon: 'ti-reload' } );
            })
          })  

          return {

            statsCards: [
              {
                type: 'warning',
                icon: 'ti-briefcase',
                title: 'Cases',
                value:  total_orders,
                Time1: '08:00',
                valuenow: '250',
                textValueNow: 'Now',
                footerText: 'Updated now',
                footerIcon: 'ti-reload'
              },
]

这是我的 json 文件的结果：

{"total_orders":389,"total_cases":1188,"total_cases_08":[{"numbers":"389","type":"orders","cron":"2018-02-15 08:00:19"}],"total_orders_08":[{"numbers":"1191","type":"Cases","cron":"2018-02-15 08:00:18"}]}

我试图在 stascards 上显示 total_orders":389 的价值

感谢您的帮助

Answer 1

如果我理解正确，这样做应该可以：

new Vue({
  el: "#app",

  data() {
      statsCards: []
  },
  mounted() {
    axios.get("http://localhost:3000/statcard").then(response => {
      this.statsCards.push({
        type: "warning",
        icon: "ti-server",
        title: "Cases",
        value: response.data.total_orders,
        footerText: "Updated now",
        footerIcon: "ti-reload"
      });
    });
  }
});