鍍金池/ 問答/HTML/ Vue echarts中怎么異步加載數(shù)據(jù) ?

Vue echarts中怎么異步加載數(shù)據(jù) ?

這樣單獨放在一個js文件里 然后在組件引入 報錯 查找不到, 里面的數(shù)據(jù)從后臺服務(wù)器拿到數(shù)據(jù)后怎么給到option對應(yīng)的數(shù)據(jù)里,所有的數(shù)據(jù)都是動態(tài)的
export const option = {
title: [

{
  text: "車輛狀態(tài)"
},
{
  text: total.value,
  left: "30%",
  top: "46%",
  textAlign: "center",
  textBaseline: "middle",
  textStyle: {
    color: "#8483EF",
    fontWeight: "normal",
    fontSize: 42
  }
},
{
  text: total.name,
  left: "30%",
  top: "55%",
  textAlign: "center",
  textBaseline: "middle",
  textStyle: {
    color: "#999",
    fontWeight: "normal",
    fontSize: 20
  }
}

],
tooltip: {

trigger: "item",
formatter: "",
backgroundColor: "rgba(0,0,0,0.7)", // 背景
padding: [8, 10] //內(nèi)邊距

},
legend: {

orient: "",
icon: "circle",
right: 100,
top: "center",
itemGap: 18,
textStyle: {
  color: "#666",
  fontSize: 16
},
// formatter: function (series) {
//   return series[0].data[0].value
// },
data: data_name

},
// graphic: {
// type: "text",
// left: "22%", // 相對父元素居中
// top: "middle", // 相對父元素居中
// padding: [10, 10],
// style: {
// fill: "#777",
// textAlign: "center",

// text: [" 2,000n 車輛總數(shù)"],
// font: "30px Microsoft YaHei"
// }
// },
series: [

{
  type: "pie",
  radius: [146, 160],
  center: ["30%", "50%"],
  color: "blue",
  hoverAnimation: false,
  avoidLabelOverlap: false,
  label: {
    normal: {
      show: false,
      position: "center"
    },
    formatter: `{value} 輛`
  },
  data: originalData
  // data: [
  //   {
  //     value: 150,
  //     name: "置業(yè)中",
  //     itemStyle: {
  //       color: "blue"
  //     }
  //   },
  //   {
  //     value: 150,
  //     name: "作業(yè)中",
  //     itemStyle: {
  //       color: "pink"
  //     }
  //   },
  //   {
  //     value: 150,
  //     name: "已報廢",
  //     itemStyle: {
  //       color: "purple"
  //     }
  //   },
  //   {
  //     value: 150,
  //     name: "維修中",
  //     itemStyle: {
  //       color: "hotpink"
  //     }
  //   },
  //   {
  //     value: 150,
  //     name: "超載中",
  //     itemStyle: {
  //       color: "skyblue"
  //     }
  //   },
  //   {
  //     value: 1000,
  //     name: "請假中",
  //     itemStyle: {
  //       color: "lightgreen"
  //     }
  //   }
  // ]
}

]
}

回答
編輯回答
默念

先在外層定義好 option 數(shù)據(jù)請求回來之后 修改 option 然后 init

2018年4月25日 00:46