可使用封裝好的 echarts-for-weixin
下載說明
圖片來源 echarts-for-weixin 文檔.png
引入組件說明
圖片來源 echarts-for-weixin 文檔.png
導入組件
{
"usingComponents": {
"ec-canvas": "../../ec-canvas/ec-canvas"
}
}
ts/js 引入 echarts
import * as echarts from "../../../../../utils/lib/ec-canvas/echarts"; //引入外部的js工具類
ts 文件引入會報找不到文件, 使用 //@ts-ignore 屏蔽ts檢查
//@ts-ignore
import * as echarts from "../../../../../utils/lib/ec-canvas/echarts"; //引入外部的js工具類
使用
在實際項目中可根據(jù)自身需求決定使用初始化echart方式
圖片來源 echarts-for-weixin 文檔.png
使用問題小計
1、組件使用 hidden 后， echact 不顯示
解決思路： setData() 成功后娜亿， 通過懶加載初始化 echact
/** `setData` 函數(shù)用于將數(shù)據(jù)從邏輯層發(fā)送到視圖層
*（異步）茅糜，同時改變對應的 `this.data` 的值（同步）鲁冯。
*
* **注意：**
*
* 1. **直接修改 this.data 而不調(diào)用 this.setData 是無法改變頁面的狀態(tài)的胯府，還會造成數(shù)據(jù)不一致**铝阐。
* 1. 僅支持設置可 JSON 化的數(shù)據(jù)拖刃。
* 1. 單次設置的數(shù)據(jù)不能超過1024kB删壮，請盡量避免一次設置過多的數(shù)據(jù)。
* 1. 請不要把 data 中任何一項的 value 設為 `undefined` 兑牡，否則這一項將不被設置并可能遺留一些潛在問題央碟。
*/
setData(
/** 這次要改變的數(shù)據(jù)
*
* 以 `key: value` 的形式表示，將 `this.data` 中的 `key` 對應的值改變成 `value`均函。
*
* 其中 `key` 可以以數(shù)據(jù)路徑的形式給出亿虽，支持改變數(shù)組中的某一項或對象的某個屬性，如 `array[2].message`苞也，`a.b.c.d`洛勉，并且不需要在 this.data 中預先定義。
*/
data: Partial<D> & IAnyObject,
/** setData引起的界面更新渲染完畢后的回調(diào)函數(shù)如迟，最低基礎庫： `1.5.0` */
callback?: () => void
): void
2收毫、force-use-old-canvas 在微信新的基礎中不用使用，使用后真機不顯示echact圖標內(nèi)容
force-use-old-canvas="true"
