1.跨域
其中說到跨域的話首要的就是axios的配置
// 創(chuàng)建axios實(shí)例
axios.defaults.timeout = 60000 // 響應(yīng)時(shí)間
axios.defaults.headers.post['Content-Type'] = 'application/json;charset=UTF-8'
axios.defaults.headers.Authorization = 'WSAuth' + toBase64Encode(getToken())
// 配置請(qǐng)求頭
axios.defaults.baseURL = process.env.BASE_API
// 這個(gè)是必須配置的
axios.defaults.withCredentials = true
2.傳輸附件后臺(tái)接收不到
主要原因是后臺(tái)使用的是Multipart數(shù)組接收寨昙,vue這邊使用的是formdata,紅框一定要這樣寫镐捧,我被坑了好久冈敛,并且傳輸文件類的時(shí)候,不需要設(shè)置contentType筐眷,由于我用axios共同全局設(shè)置了這個(gè) 'Content-Type': 'multipart/form-data' 之后導(dǎo)致瀏覽器解析的時(shí)候驻呐,沒有這個(gè)boundry(見圖)碴犬,最后還是用了vue-resource中的http解決的
3.權(quán)限菜單
由于后臺(tái)不讓前端帶上角色和權(quán)限之類的信息题暖,全部從后端拿數(shù)據(jù)按傅,導(dǎo)致前端必須全部配置好所有的路由,通過后端返回的菜單信息filter出自己的菜單信息后顯示
4.刷新畫面
想要刷新頁面就是這方法吧胧卤,挺好用
refreshPage() {
? ? ? location.reload()
? ? }
5路由變化頁面數(shù)據(jù)不刷新問題
場景:比如商品詳情數(shù)據(jù)唯绍,依賴路由的params參數(shù)獲取的(ajax寫在created生命周期里面),因?yàn)槁酚蓱屑虞d的關(guān)系枝誊,退出頁面再進(jìn)入另一個(gè)商品頁面并不會(huì)運(yùn)行created組件生命周期况芒,導(dǎo)致文數(shù)據(jù)還是上一個(gè)數(shù)據(jù)。
解決方法:watch監(jiān)聽路由是否變化
watch: {
? '$route' (to, from) { //監(jiān)聽路由是否變化
? ? if(this.$route.params.id){//是否有id
? ? ? //獲取數(shù)據(jù)
? ? }
? }
}