使用axios發送ajax請求

1.安裝

npm install axios

2.在Home.vue中引入

import axios from 'axios'

export default {

  name: 'Home',

  components: {

    HomeSwiper,

    HomeIcons,

    HomeRecommend,

    HomeWeekend

  },

   methods: {

    getHomeInfo () {

      axios.get('/api/index.json').then(this.getHomeInfoSucc)

    },

    getHomeInfoSucc (res) {

      console.log(res)

    }

  },

  mounted () {

    this.getHomeInfo()

  }

}

3.創建static文件夾，在里面放入要請求的index.json（只有static文件夾是對外暴露的，放別的地方無法訪問）

訪問網址：http://localhost:8080/static/mock/index.json

4.屏蔽模擬數據，不要上傳到git，在.gitignore里添加

static/mock

5.打開config文件夾，修改index.js，對api路徑做代理轉發

module.export = {
  dev: {
    proxyTable: {
      'api': {
        target: 'http://localhost:8080',
        pathRewrite: {
          '^api': '/static/mock'
        }
      }
    }
  }  
}

6.父組件通過標簽屬性傳值，子組件通過props接收