Vue使用echarts报错提示 vue.runtime.esm.js?2b0e:1897 Error: Initialize failed: invalid dom.
在Vue脚手架+antd搭建的项目中使用Antd的Tabs标签页进行切换时,B页面的Echarts不进行渲染,而且报错提示说Dom无效,思考了一下原因应该是切换页面后,本页面的dom还未渲染,但是已经调用了Echarts的函数所以才会出现这种情况。所以我们可以在页面数据改变之后或者Dom改变之后再调用函数callback(key) { //Tabs点击跳转事件if (key == 2) {//确认
·
在Vue脚手架+antd搭建的项目中使用Antd的Tabs标签页进行切换时,B页面的Echarts不进行渲染,而且报错提示
说Dom无效,思考了一下原因应该是切换页面后,本页面的dom还未渲染,但是已经调用了Echarts的函数所以才会出现这种情况。
所以我们可以在页面数据改变之后或者Dom改变之后再调用函数
callback(key) { //Tabs点击跳转事件
if (key == 2) { //确认跳转到B页面
this.$nextTick(() => { //使用this.$nexTick方法进行渲染
this.initEcharts2() //Echarts的渲染函数
})
}
},
this.$nextTick( () =>{
这里写函数
} )
因为Vue中的dom和数据改变都是异步进行的,而放在这里面则会等待数据和dom操作完毕之后才进行执行。
更多推荐
已为社区贡献1条内容
所有评论(0)