1.局部引入

import echars from "echarts"

2.引入composition-api

import {reactive,computed,onMounted,toRefs} from '@vue/composition-api';

3.定義一個方法

const init=()=>{
var myChart = echarts.init(document.getElementById('main'));

// 指定圖表的配置項和數據
var option = {
title: {
text: 'ECharts 入門示例'
},
tooltip: {},
legend: {
data:['銷量']
},
xAxis: {
data: ["襯衫","羊毛衫","雪紡衫","褲子","高跟鞋","襪子"]
},
yAxis: {},
series: [{
name: '銷量',
type: 'bar',
data: [5, 20, 36, 10, 10, 20]
}]
};

// 使用剛指定的配置項和數據顯示圖表。
myChart.setOption(option);

};

//掛載完成調用方法

onMounted(()=>{

init()

}

)

總結

以上是生活随笔為你收集整理的vue. 3.0使用echar的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。