1.跨域
其中说到跨域的话首要的就是axios的配置
共同一个fetch请求// 创建axios实例
axios.defaults.timeout = 60000 // 响应时间
axios.defaults.headers.post['Content-Type'] = 'application/json;charset=UTF-8'
axios.defaults.headers.Authorization = 'WSAuth' + toBase64Encode(getToken())
// 配置请求头
axios.defaults.baseURL = process.env.BASE_API
// 这个是必须配置的
axios.defaults.withCredentials = true
2.传输附件后台接收不到
主要原因是后台使用的是Multipart数组接收,vue这边使用的是formdata,红框一定要这样写,我被坑了好久,并且传输文件类的时候,不需要设置contentType,由于我用axios共同全局设置了这个 'Content-Type': 'multipart/form-data' 之后导致浏览器解析的时候,没有这个boundry(见图),最后还是用了vue-resource中的http解决的
红框一定要这样写 这个分割文件的标志位 vue-resources3.权限菜单
由于后台不让前端带上角色和权限之类的信息,全部从后端拿数据,导致前端必须全部配置好所有的路由,通过后端返回的菜单信息filter出自己的菜单信息后显示
4.刷新画面
想要刷新页面就是这方法吧,挺好用
refreshPage() {
location.reload()
}
5路由变化页面数据不刷新问题
场景:比如商品详情数据,依赖路由的params参数获取的(ajax写在created生命周期里面),因为路由懒加载的关系,退出页面再进入另一个商品页面并不会运行created组件生命周期,导致文数据还是上一个数据。
解决方法:watch监听路由是否变化
watch: {
'$route' (to, from) { //监听路由是否变化
if(this.$route.params.id){//是否有id
//获取数据
}
}
}
网友评论