vue中使用element ui的弹窗与echarts之间的问题详解
今天项目中有个需求，就是在页面中点击一个图标，弹出一个抽屉式的弹窗（弹窗是elementUI的抽屉），弹窗里边是echarts呈现的数据，当我直接用echarts的时候，报错dom没有获取到；
这就陷入疑惑，平时都是这样获取的，怎么今天就不行了呢，搜索了很多答案之后才知道，在刚进入页面的时候抽屉是关闭的，那echarts不进行获取dom，当点击抽屉出来的时候，有个opened事件，在这个事件里边进行echarts的初始化，执行数据；
{b}:{c}({d}%)' }, legend:{ orient:'vertical', right:'10%', top:'35%', data:['A','B','C','D'] }, series:[ { name:'访问来源', type:'pie', radius:'70%', center:['25%','60%'], data:[ {value:335,name:'A'}, {value:310,name:'B'}, {value:234,name:'C'}, {value:135,name:'D'} ], label:{ normal:{ show:false, position:'center' } } } ] }, }} } method:{ opens(){ this.$nextTick(()=>{ this.pie1() }) }, pie1(){ this.$echarts.init(this.$refs.main).setOption(this.option1) } }
这样防止dom没有渲染之前，数据先加载，主要是用了elementui弹窗的open方法，具体的为啥用这个方法，还需要研究下
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。
声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。