组件相关

一、Element

1.级联选择器

报错：TypeError: Cannot read property 'level' of null at VueComponent.handleExpand ，当前使用 element 版本为 2.14.1

报错截图：

解决： el-cascader 上添加 :key="Math.random().toString(36)

<el-cascader
  :key="Math.random().toString(36)"
  v-model="formInline.warehouseType"
  :options="warehouseTypeList"
  :props="{multiple: true}"
  filterable
  clearable
/>

按上面改了，下拉面板点击一次就收起来了，用户体验不好。后来想来想去，脑子一热，把 value 的值 改成 string 类型，就不报错了，并且面板用户能一直点击。

最终建议：将 element 升级到最新版本。

二、Echarts

报错： Uncaught TypeError: Cannot read property resize of null at VueComponent.chartResize

报错截图：

原先的的代码:

mounted() {
    // 适应浏览器窗口变化
    window.addEventListener('resize', this.chartResize);
    // 适应当前页面宽度的变化
    this.resizeObs = new ResizeObserver(() => {
      this.chartResize();
    });
    this.resizeObs.observe(document.getElementById('myChart'));
}
  
// 让图表随着浏览器窗口变化自适应
chartResize() {
  this.myChart.resize();
}

修改后的代码：

mounted() {
    // 适应浏览器窗口变化
    window.addEventListener('resize', this.chartResize);
    // 适应当前页面宽度的变化
    this.resizeObs = new ResizeObserver(() => {
      this.chartResize();
    });
    this.resizeObs.observe(document.getElementById('myChart'));
}

 // 让图表随着浏览器窗口变化自适应
chartResize() {
    if (this.myChart) this.myChart.resize();
}