命令行创建vue脚手架、引入jq等插件

创建vue脚手架:

https://blog.csdn.net/Ag_wenbi/article/details/86359276

二、vue映入jquery

1、npm install jquery

2、在webpack.base.conf.js中添加

  plugins:[
    new webpack.ProvidePlugin({
      $: "jquery",
      jQuery: "jquery"
    })
  ],

3、main.js中引用 import $ from 'jquery';

二、引入滚动条niceScroll  

cnpm install jquery.nicescroll

main.js中引用 import 'jquery.nicescroll';//滚动条插件

三、引入echarts

cnpm install echarts --save

main.js中

  1. import Echarts from 'echarts'

  2. Vue.prototype.echarts = Echarts

  3. Vue.use(Echarts)

mounted() {
      var dom = document.getElementById('echarts')
      var myChart = this.echarts.init(dom)
      // 绘制图表
      myChart.setOption({
        series: [{
          name: '访问来源',
          type: 'pie',
          radius: '55%',
          data: [{
              value: 235,
              name: '视频广告'
            },
            {
              value: 274,
              name: '联盟广告'
            },
            {
              value: 310,
              name: '邮件营销'
            },
            {
              value: 335,
              name: '直接访问'
            },
            {
              value: 400,
              name: '搜索引擎'
            }
          ]
        }]
      });
    },

猜你喜欢

转载自blog.csdn.net/qq_36784628/article/details/86562009