Ustinian_ 2022-04-10 23:19 采纳率: 83.3%
浏览 265
已结题

Vue2.x使用echarts 在echarts实例化时报错

问题遇到的现象和发生背景
问题相关代码,请勿粘贴截图

index.html中引入echarts文件

<!-- 引入echarts文件后 window.echarts -->
        <script src="static/lib/echarts.min.js"></script>

在main.js中 将全局echarts挂载到Vue的原型对象上

// 将全局echarts挂载到Vue的原型对象上
// 别的组件中 this.$echarts
Vue.prototype.$echarts = window.echarts

在trendCom.vue中实例化echarts对象

this.chartInstance = this.$echarts.init(this.$refs.trend_ref)

运行结果及报错内容
[Vue warn]: Error in mounted hook: "TypeError: Cannot read properties of undefined (reading 'getAttribute')"

found in

---> <TrendCom>
       <TrendPage> at src/views/trendPage.vue
         <App> at src/App.vue
           <Root>
warn @ vue.runtime.esm.js?c320:619
logError @ vue.runtime.esm.js?c320:1893
globalHandleError @ vue.runtime.esm.js?c320:1888
handleError @ vue.runtime.esm.js?c320:1848
invokeWithErrorHandling @ vue.runtime.esm.js?c320:1871
callHook @ vue.runtime.esm.js?c320:4235
insert @ vue.runtime.esm.js?c320:3158
invokeInsertHook @ vue.runtime.esm.js?c320:6390
patch @ vue.runtime.esm.js?c320:6609
Vue._update @ vue.runtime.esm.js?c320:3963
updateComponent @ vue.runtime.esm.js?c320:4081
get @ vue.runtime.esm.js?c320:4495
run @ vue.runtime.esm.js?c320:4570
flushSchedulerQueue @ vue.runtime.esm.js?c320:4326
eval @ vue.runtime.esm.js?c320:1989
flushCallbacks @ vue.runtime.esm.js?c320:1915
Promise.then (async)
timerFunc @ vue.runtime.esm.js?c320:1942
nextTick @ vue.runtime.esm.js?c320:1999
queueWatcher @ vue.runtime.esm.js?c320:4418
update @ vue.runtime.esm.js?c320:4560
Vue.$forceUpdate @ vue.runtime.esm.js?c320:3984
eval @ index.js?0e5a:244
eval @ index.js?0e5a:242
eval @ index.js?0e5a:119
eval @ trendCom.vue?6f0b:28
./src/components/trendCom.vue @ app.js:41
__webpack_require__ @ app.js:374
_requireSelf @ app.js:648
apply @ app.js:1352
(anonymous) @ app.js:890
internalApply @ app.js:888
(anonymous) @ app.js:825
waitForBlockingPromises @ app.js:779
(anonymous) @ app.js:823
Promise.then (async)
(anonymous) @ app.js:822
Promise.then (async)
(anonymous) @ app.js:802
Promise.then (async)
hotCheck @ app.js:793
check @ dev-server.js?2743:14
eval @ dev-server.js?2743:55
emit @ events.js?b914:153
reloadApp @ reloadApp.js?7531:46
ok @ index.js?abc1:175
eval @ socket.js?d6e0:60
client.onmessage @ WebSocketClient.js?5586:50
vue.runtime.esm.js?c320:1897 TypeError: Cannot read properties of undefined (reading 'getAttribute')
    at echarts.min.js:22:210725
    at Yd (echarts.min.js:22:210761)
    at Object.t.init (echarts.min.js:22:748697)
    at VueComponent.initChart (trendCom.vue?15e1:29:1)
    at VueComponent.mounted (trendCom.vue?15e1:18:1)
    at invokeWithErrorHandling (vue.runtime.esm.js?c320:1863:1)
    at callHook (vue.runtime.esm.js?c320:4235:1)
    at Object.insert (vue.runtime.esm.js?c320:3158:1)
    at invokeInsertHook (vue.runtime.esm.js?c320:6390:1)
    at VueComponent.patch [as __patch__] (vue.runtime.esm.js?c320:6609:1)

我的解答思路和尝试过的方法
我想要达到的结果
  • 写回答

1条回答 默认 最新

  • 前行的枫_denglinbo 2022-04-11 09:10
    关注

    注意看这个:"TypeError: Cannot read properties of undefined (reading 'getAttribute')" 。看看你getAttribute方法有没有用错

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

问题事件

  • 系统已结题 5月4日
  • 已采纳回答 4月26日
  • 创建了问题 4月10日

悬赏问题

  • ¥15 如何扩大AIS数据容量
  • ¥15 单纯型python实现编译报错
  • ¥15 c++2013读写oracle
  • ¥15 c++ gmssl sm2验签demo
  • ¥15 关于模的完全剩余系(关键词-数学方法)
  • ¥15 有没有人懂这个博图程序怎么写,还要跟SFB连接,真的不会,求帮助
  • ¥15 PVE8.2.7无法成功使用a5000的vGPU,什么原因
  • ¥15 keil官网下载psn序列号在哪
  • ¥15 想用adb命令做一个通话软件,播放录音
  • ¥30 Pytorch深度学习服务器跑不通问题解决?