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()