Vue中全局和按需引入Echarts

一、全局引入

在main.js中引入:

1 // 引入echarts
2 import echarts from 'echarts'
3 
4 Vue.prototype.$echarts = echarts

Hello.vue中的methods中:

// 基于准备好的dom,初始化echarts实例

let myChart = this.$echarts.init(document.getElementById('myChart'))

二、按需引入

Hello.vue中:

1 // 引入基本模板
2 let echarts = require('echarts/lib/echarts')
3 // 引入柱状图组件
4 require('echarts/lib/chart/bar')
5 // 引入提示框和title组件
6 require('echarts/lib/component/tooltip')
7 require('echarts/lib/component/title')

在methods:中:

// 基于准备好的dom,初始化echarts实例

let myChart = echarts.init(document.getElementById('myChart'))

注意: 这里全局引入是 this.$echarts.init() 按需引入是:echarts.init()