dataV 赋值后盾数据, 无奈渲染胜利
1. 开发环境 vue+typescripts+dataV
2. 电脑系统 windows10 专业版
3. 在开发的过程中, 咱们会应用到一些图表框架, 在这里我应用的是 dataV, 在应用 dataV 的应用, 你可能会遇到这一中状况, 那就是 dataV 赋值胜利了后盾的数据, 然而却渲染不进去, 应用假数据是没有问题的, 这个是什么问题造成的呢? 解决办法是?
4. 解决办法如下, 在 return 中增加如下代码:
// 后盾传给你的值, 必须是一个对象模式
// 留神, 这个数据结构是 datav 环形图的
BtObj: {
data: [
{
name: "周口",
value: 55,
},
{
name: "南阳",
value: 120,
},
],
color: ["#C23531", "#0F8A61"],
},
5. 而后在数据申请的时候, 间接把这个值从新赋值为后盾的数据就能够啦, 实例代码如下:
chen().then((res) => {console.log(res);
console.log(res.data);
let _Rthis: any = this;
let ChenArr: any = res.data.data;
console.log("我是 data");
console.log(_Rthis.BtObj.data);
console.log("完结");
_Rthis.BtObj = res.data.config;
console.log("我是 data");
console.log(_Rthis.BtObj.data);
console.log("完结");
})
6. 而后在 template 中增加如下代码:
<dv-active-ring-chart
:config="BtObj"
style="width: 300px; height: 300px"
/>
7. 本期的教程到了这里就完结啦, 是不是很简略, 让咱们一起致力走向巅峰!