想要使用echarts首先要下载依赖,项目文件夹根目录下打开cmd输入指令

npm install --save echarts

接下来是两种引用方式

echarts全局引入步骤

1、在main.js中写入如下代码(注意引入是require不是import

const echarts =require('echarts')
Vue.prototype.$echarts = echarts

2、使用

var myChart = this.$echarts.init(document.getElementById('main'));

echarts按需引入步骤

1、在需要引用的组件写入如下代码

<script>
import * as echarts from "echarts";
export default {
  mounted() {
    //获取需要操作的dom模板
    var chartDom = document.getElementById("main");
    //注意此处与全局不同
    var myChart = echarts.init(chartDom);

    var option;
    option ={xxxxxx}
     }
</script>

最容易出错的地方!!!一定要注意!!!

初始化echarts实例时,全局引入是this.$echarts.init(),按需引入是echarts.init()

Logo

前往低代码交流专区

更多推荐