文章目录
用于前后端分离项目 返回的是 Promise
axios请求别名
axios是一个就promise的HTTP库,可以用在浏览器和node.js中
配置路由
1.配置路由文件
routes.js:
let Index=()=>import('../view/Index.vue')
export default[
{
path:'/',
name:'index',
component:Index
}
]
index.js:
import Vue from 'vue'
import vueRouter from 'vue-router'
Vue.use(vueRouter);
import routes from './routes';
let router= new vueRouter({
mode:'history',
routes
});
export default router;
2.挂载到main.js
new Vue({
el: '#app',
router,
render: h => h(App)
})
3.在App.vue中配置出口
<div id="app">
<router-view></router-view>
</div>
一、配置axios
我们使用第三方库
vue 使用axios插件
cnpm install --save-dev axios
(一)请求方法(不使用)
这种方法简单,但是在项目中到处使用会太冗余,
我们在接下来封装成模块使用
main.js:
(1)get请求
1.无参请求
import axios from 'axios'
axios.get('/').then((res)=>{
}).catch((err)=>{
})
2.带参请求
import axios from 'axios'
axios.get('/',{
params:{
id:1
}
}).then((res)=>{
}).catch((err)=>{
})
(2)post请求
1.无参请求
import axios from 'axios'
axios.post('/').then((res)=>{
}).catch((err)=>{
})
2.带参请求
import axios from 'axios'
axios.get('/',{
id:1
}).then((res)=>{
}).catch((err)=>{
})
(2)axios封装 !
axios :专门处理cros跨域
[前后端分离项目 :需要后端配置好cros跨域,前端直接访问]
在src目录下建立一个请求
用来 封装ajax请求 以及其他操作
1.设置axios请求超时
//封装ajax请求 以及其他操作
/*
axios 专门处理cros跨域
*/
import axios from "axios";
//1.设置axios请求超时
/**
* @param