1.安装echarts依赖
npm install echarts --save-dev
2.main.js 引入 将其绑定到vue原型上
import * as echarts from 'echarts'
Vue.prototype.$echarts = echarts
3. 接着,我们就可以在任何一个组件中使用echarts了,接下来我们在初始化项目中的helloWorld组件中使用echarts配置图标,具体如下:
<template>
<div class="hello">
<div style="width: 500px; height: 500px" ref="chart"></div>
</div>
</template>
<script>
export default {
name: "HelloWorld",
mounted() {
this.initCharts();
},
methods: {
initCharts() {
let myChart = this.$echarts.init(this.$refs.chart);
console.log(this.$refs.chart); // 绘制图表
myChart.setOption({
title: { text: "在Vue中使用echarts" },
tooltip: {},
x