webstorm下vue对element-ui+echart的引入使用

首先先通过npm下载安装element、echarts相关组件 ，这里不再做多叙述

Vue引入element-ui

在main.js中导入，再使用vue.use()语句调用，之后即可在组件中使用，需注意element必须还要引入css样式

import Element from 'element-ui'

import 'element-ui/lib/theme-chalk/index.css'

Vue.use(Element)

Vue引入echarts

在main.js中加入以下

import echarts from 'echarts'

Vue.prototype.$echarts = echarts

2.根据官方示例在组件中中加入需要的模型，然后在中用一个dev引入即可

具体Echart使用步骤：

1.首先引入echarts库,

2. 在中开辟一个显示图形的区域，例如：

3.图表初始化，

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

4.option函数设置参数

5.Setoption函数调用option

例如一个简单的两个节点的关系图如下：