nuxt中使用axios/@nuxtjs/axios 以及使用mock

1. 搭建nuxt項目：參考https://blog.csdn.net/qq_42231156/article/details/90174203。

2. nuxt中使用全局@nuxtjs/axios：參考：https://blog.csdn.net/weixin_30794491/article/details/99910973。

    2.1 如果pageage.json中的dependencies沒有"@nuxtjs/axios"就下載安裝：npm install --save @nuxtjs/axios

    2.2 在nuxt.config.js中配置：

   module.exports = {    
        modules: [
            '@nuxtjs/axios',
        ],
        axios: {
            proxy: true,
            prefix: '/api/',
            credentials: true
        },

        proxy: {
            '/api/': {
            target: 'https://xxx.cn',
            pathRewrite: {
                '^/api/': '/',
                changeOrigin: true
            }
            }
        },
        build: {
            vendor: ['axios'],
        }
    }

    2.3 在組件中調用：

mounted() {
        this.$axios.get("/index").then(res=>{
            console.log(res)
        })
}

3. nuxt中使用axios：

     3.1 下載axios：npm install --save axios

     3.2 在需要的頁面引入使用：import axios from "axios"

axios.get("user.json").then(res=>{
    console.log(res)
})

 4. nuxt使用mock：

     4.1 下載mock：npm install --save mock

     4.2 在plugins/mock.js文件創建：

var Mock = require('mockjs')

Mock.mock(/user\.json/, {
  'list|1-10': [{
    'id|+1': 1,
    'email': '@EMAIL'
  }]
})

    4.3 在nuxt.config.js引入mock插件：

 plugins: [
      { src: '~plugins/mock', ssr: true }
]

    4.4 在axios請求mock的數據：

axios.get("user.json").then(res=>{
    console.log(res)
})