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

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 esp8266控制共阳极wrgb灯板无法关闭所有led灯
  • ¥100 python读取速度问题
  • ¥15 stm32f407使用DMA问题
  • ¥15 您好 这个API接口该怎么弄 网站搭建好了 API也有 现在就不知道该怎么填写API 不知道怎么用
  • ¥88 用uniapp写一个多端的程序,用到高德地图,用高德的JSAPI吗?
  • ¥20 关于#c++#的问题:水果店管理系统
  • ¥30 dbLinq最新版linq sqlite
  • ¥20 对D盘进行分盘之前没有将visual studio2022卸载掉,现在该如何下载回来
  • ¥15 完成虚拟机环境配置,还有安装kettle
  • ¥15 有人会搭建生鲜配送自营+平台的管理系统吗