命令行創建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: '搜索引擎'
            }
          ]
        }]
      });
    },

二、模擬後臺，傳數據

       1、static文件夾下創建mock文件夾，在mock下創建index.json文件

index.json文件模版

2、修改index.js配置文件

proxyTable: {
      '/api':{
        target:'http://localhost:8484',
        pathRewrite:{
          '^/api':'/static/mock'
        }
      }
    },

 4、請求並打印數據

三、父子組件傳數據

1、 父組件定義、並賦值，在標籤處傳值

2、子組件接收值並使用

3、子組件傳值個父組件

子組件中：觸發一個方法，在方法裏執行this.$emit(xx,xx)

父組件中：

監聽某個值變化