datav显示异常问题遇到的坑

常见问题

图表在页面上渲染不出来

1.未设置宽高

<dv-scroll-ranking-board :config="config" :key="key" style="width:400px;height:250px;/>

2.数据不更新

见官网

this.config = { ...this.config }

3.莫名其妙的问题

同一个组件 完全一样的代码 有的可以正常显示 有的就不行 ？

页面渲染不显示图表或者只出现几秒消失 修改代码保存或者改变浏览器尺寸又会出现

经测试，不知道和谁有关 但问题解决了 

通过改变浏览器尺寸可以显示猜测和宽高异常有关 在给config.data赋值之后强制重绘 具体见官网

this.$nextTick(() => {
        this.key += 1
      })

4.监听数据更新

我的data是监听一个变量赋值

代码直接写在watch里面

直接赋值，有新值，但data为空

 data() {
    return {
      config: {
        data: [],
        carousel: 'page',
        rowNum: 5
      },
      key: 1,
    };
  },

this.config.data = this.getCounty

换arr.push或者其他方式 显示data有数据但页面还是渲染不出来

最后，经测试 需要将组件更新数据写成方法，再在watch里面调用方法