Vue 开发中遇到的各种问题(全是坑)——0.1

昨天由于产品提了需求,所以就赶需求,没有写点随笔啥的,今天补一下,这里我将我对vue开发中遇见的一些问题记录下,接下来也会在工作中遇到的问题,如何解决的也会写进来,以便大家遇到一样的问题怎么解决,当然个人是暂时不能和大神相比的,写的不对的,可以指出来,共同进步....

1、首先说下 图表吧,最近在做公司后台管理项目,需要用到图标的插件,我这里使用的是 v-charts,使用期间发现就是当数据精度大于小数点两位,显示不出来,全是 0%

就类似这样 

后来看了官网才知道 官网是 这样说的:

v-charts处理数据类型时默认保留两位有效数字,但是当数字较小并设置为百分比类型时复制代码

它默认是两位有效数字,然后也提供了解决方法 

每个图表内都有digit配置项,设置此属性,保证设置类型后,数值较小也能够正常显示复制代码

 如下 

虽然解决了这个显示小数的问题,但我又遇见了下一个,就是当图表需要切换的时候,我发现所有的数,都默认给我加了 后面三位小数,这就很烦,然后我就切换的时候当点击这个tab的时候重新配置 图表属性

解决代码如下:

template里
// 加了一个 settings属性 然后chartSettings 是个对象 {}
"chartData" :settings="chartSettings">

// data里 先设置 为一个空对象
chartSettings: {}// js里 切换tab栏的时候 这里是代码,当然意思是当点击切换到需要展示的 tab下,就重新设置 chartSettings

if (这是里需要切换的tab栏展示当前 需要显示 小数后面多位的) {
  this.chartSettings = {
    yAxisType: ['percent'],
    digit: 3
  }
}else {
  this.chartSettings = {}
}
复制代码
 最终解决了我的需求 

这是官网的解决方案

v-charts.js.org/#/skill-dem…


转载于:https://juejin.im/post/5bbd5dc35188255c697821fb

你可能感兴趣的:(Vue 开发中遇到的各种问题(全是坑)——0.1)