安装
npm install echarts --save
main.ts
import { createApp } from 'vue' import './style.css' import * as echarts from 'echarts' import App from './App.vue' // @ts-ignore import router from "./router/index" const app = createApp(App) app.use(router) app.mount('#app') app.config.globalProperties.$echarts = echarts
bar.vue
<template> <div id="char" style="width: 600px; height: 600px"></div> </template> <script lang='ts' setup> import {onMounted} from 'vue'; // Echarts 为init(dom元素后的类型) // EChartsOption 为 option 的类型 import {ECharts, EChartsOption, init} from 'echarts'; onMounted(() => { const charEle = document.getElementById('char') as HTMLElement; const charEch: ECharts = init(charEle); const option: EChartsOption = { xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, yAxis: { type: 'value' }, series: [ { data: [150, 230, 224, 218, 135, 147, 260], type: 'bar' } ] }; charEch.setOption(option); }); </script> <style scoped> </style>
标签:vue,const,app,EChartsOption,vue3,引入,import,echarts From: https://www.cnblogs.com/myqinyh/p/16802603.html