nuxt项目中使用axios

项目环境：nuxt+vue+axios

针对问题：如何在vue框架nuxt中使用axios模块

解决思路：

               (1) 把nuxtjs-axios模块添加项目中

               (2) 配置nuxt.config.js

               (3) 简单使用

参考网址：http://www.axios-js.com/zh-cn/docs/nuxtjs-axios.html

注意事项：前台框架不同，使用的模块也有些不一样的。

              例如：你没有使用nuxt框架，只使用vue，那么添加axios模块方式是：npm install --save axios vue-axios

具体步骤：

1. 把nuxtjs-axios模块添加到项目

 yarn add @nuxtjs/axios       // 使用yarn来安装模块

 npm install @nuxtjs/axios  // 使用npm来安装模块

注：不同的包管理器，要使用不同的命

2. 配置nuxt.config.js

   简单使用

modules: [
'@nuxtjs/axios'
],

如果这步完成，可以在项目中方法使用console.log(this) ，这时候可以看到该对象中有$axios属性了

如果你想使用代理可以这样写

modules: [
'@nuxtjs/axios'
],
/*
** Axios module configuration
*/
axios: {
proxy: true,
// prefix: '/api/',
credentials: true
// See https://github.com/nuxt-community/axios-module#options
},
proxy: {
'/api/': {
target: 'https://h5api.zhefengle.cn',//这个网站是开源的可以请求到数据的
pathRewrite: {
'^/api/': '/',
changeOrigin: true
}
}
},

vue中使用：

let that=this;
this.$axios.get("/api/index.html").then(res=>{
alert(res.data.code);
});