踩坑：echarts中dataZoom失效 vue3

vue3 dataZoom echarts

渣渣大叔

5008人浏览 · 2022-02-24 16:42:46

渣渣大叔 · 2022-02-24 16:42:46 发布

记一下踩坑
这里是vue3 项目中出现的一个问题
对于dataZoom失效，网上已经给了许多解决方法，这里不再做总结

当将echarts构建后给一个ref（）
const test = ref（你找到的div的id）
这个时候 test.value.setoption（{配置项}）是一切正常的

但如果你设置了dataZoom属性，鼠标移入后就会报错，
ref为动态值，老老实实的使用let声明就好了

同理对于有操作的echarts 还是尽量使用let
配置项可以设置ref（）来修改内部的值，但动态修改还是重新set吧

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^