溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
本文小編為大家詳細介紹“vue3+echart5遇到的坑Cannot read properties of undefined (reading 'type')怎么解決”，內容詳細，步驟清晰，細節處理妥當，希望這篇“vue3+echart5遇到的坑Cannot read properties of undefined (reading 'type')怎么解決”文章能幫助大家解決疑惑，下面跟著小編的思路慢慢深入，一起來學習新知識吧。
vue3中，使用data的方式初始化echart圖表
export default {
data() {
return {
chart: null,
...
}
},
mounted() {
this.chart = echarts.init(document.getElementById(this.id))
this.chart.setOption({...})
},
...
}在窗口大小發生變化時，需要執行this.chart.resize()動態調整圖表的大小，發生錯誤：
vue3中使用proxy的方式監聽響應式，this.chart會被在vue內部轉換成響應式對象，從而在resize 的時候獲取不到
coordSys.type
參考官方：
你可以有選擇地退出默認的深度響應式/只讀轉換模式，并將原始的，未被代理的對象嵌入狀態圖中。它們可以根據情況靈活運用：
有些值不應該是響應式的，例如復雜的第三方類實例或 Vue 組件對象。
當渲染具有不可變數據源的大列表時，跳過 proxy 轉換可以提高性能。
所以在實例化echart時，將其指定為非響應式的即可。
import { markRaw } from 'vue'
this.chart = markRaw(echarts.init(document.getElementById(this.id)))讀到這里，這篇“vue3+echart5遇到的坑Cannot read properties of undefined (reading 'type')怎么解決”文章已經介紹完畢，想要掌握這篇文章的知識點還需要大家自己動手實踐使用過才能領會，如果想了解更多相關內容的文章，歡迎關注億速云行業資訊頻道。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
