vue3中使用echart

下载echarts

npm i -S echarts 

页面引入：

import * as Echarts from 'echarts'

 使用：

 

<template>
  <div ref="myRef" style="height: 500px; width: 800px;"></div>
</template>

<script setup>
import * as Echarts from 'echarts'
const myRef = ref(null)

onMounted(() => {

  const chartInstance = Echarts.init(myRef.value)

  chartInstance.setOption({
    xAxis: {
      data: ["2015", "2016", "2017", "2018", "2019", "2020"]
    },
    yAxis: {},
    series: {
      data: [220, 100, 350, 280, 170, 310, 30],
      type: 'bar'
    }
  })
})

</script>