第一步:在src文件下创建utils文件夹并写入文件
import axios from 'axios' //提前安装axios不要忘了
// 配置全局拦截
axios.interceptors.request.use((req) => {
// console.log(req)
return req
})
axios.interceptors.response.use((res) => {
return res
})
// 声明通用的请求方法
async function request(options) {
if (!options.method) {
options.method = 'get'
}
if (options.method === 'get' || options.method === 'delete') {
options.params = options.data
}
try {
let { data: res } = await axios(options)
return res
} catch (error) {
console.log(error)
return { code: 500, msg: error.message, data: null }
}
}
export default request
第二步:写登陆页
<!-- 文件名:Login -->
<!-- 文件名:Login -->
<template>
<div class="login">
<form action="javascript:void(0)" @submit="login" class="form">
<div class="form-item">
<label for="username">username</label>
<input type="text" id="username" v-model="username" />
</div>
<div class="form-item">
<label for="password">password</label>
<input type="text" id="password" v-model="password" />
</div>
<div class="form-item">
<input type="submit" value="登录" />
<input type="reset" @click="reset" value="重置" />
</div>
</form>
</div>
</template>
<!-- 文件名:Login -->
<!-- 文件名:Login -->
第三步:在 router 文件下的 index.js 中配置路由