解決vue.js this.$router.push無效的問題
更新時(shí)間：2018年09月03日 15:31:29 作者：gang456789
今天小編就為大家分享一篇解決vue.js this.$router.push無效的問題，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧
如下所示：
login() {
if(this.email.length > 0 && this.password.length >0) {
this.$http.post('/api/login', {
user: this.email,
password: this.password
})
.then(res => {
let userPwd = res.data
if(this.password == userPwd) {
this.$router.push("/")
} else {
alert("錯(cuò)誤，請重新輸入！")
}
})
.catch(err => {
console.log(err)
})
} else {
alert("輸入錯(cuò)誤！")
}
}
this.$router.push(“/”)不是跳轉(zhuǎn)到主頁，而是變成這樣：http://127.0.0.1:8080/login?email=yejia%40qq.com&password=123456，請問哪里錯(cuò)啦？
解決方案1:
有沒有可能是已經(jīng)跳轉(zhuǎn)了，但是主頁判斷成了沒有登錄，然后又跳回來了。
解決方案2:
你這里的 this指向已經(jīng)不是 vue 的對象啦，可以這么改
login() {
const self = this;
if(this.email.length > 0 && this.password.length >0) {
this.$http.post('/api/login', {
user: this.email,
password: this.password
})
.then(res => {
let userPwd = res.data
if(this.password == userPwd) {
self.$router.push("/")
} else {
alert("錯(cuò)誤，請重新輸入！")
}
})
.catch(err => {
console.log(err)
})
} else {
alert("輸入錯(cuò)誤！")
}
}
以上這篇解決vue.js this.$router.push無效的問題就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
Vue.js學(xué)習(xí)記錄之在元素與template中使用v-if指令實(shí)例
這篇文章主要給大家介紹了關(guān)于Vue.js學(xué)習(xí)記錄之在元素與template中使用v-if指令的相關(guān)資料，文中給出了詳細(xì)的示例代碼供大家參考學(xué)習(xí)，相信對大家具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來一起看看吧。2017-06-06
Vue3新特性Suspense和Teleport應(yīng)用場景分析
本文介紹了Vue2和Vue3中的Suspense用于處理異步請求的加載提示,以及如何在組件間實(shí)現(xiàn)動(dòng)態(tài)加載,同時(shí),Teleport技術(shù)展示了如何在DOM中靈活地控制組件的渲染位置,解決布局問題,感興趣的朋友跟隨小編一起看看吧2024-07-07
Vue3.0版本強(qiáng)勢升級點(diǎn)特性詳解
這篇文章主要介紹了Vue3.0版本強(qiáng)勢升級點(diǎn)特性詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪<BR>2022-06-06
這篇文章主要為大家詳細(xì)介紹了Vue.js自定義指令的使用方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-10-10
vue引入微信sdk 實(shí)現(xiàn)分享朋友圈獲取地理位置功能
這篇文章主要介紹了h5 vue引入微信sdk 實(shí)現(xiàn)分享朋友圈，分享給朋友，獲取地理位置功能，本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-07-07
Vue+ElementUI 中級聯(lián)選擇器Bug問題的解決
這篇文章主要介紹了Vue+ElementUI 中級聯(lián)選擇器Bug問題的解決方法，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07
vue如何使用el-table遍歷循環(huán)表頭和表體數(shù)據(jù)
這篇文章主要介紹了vue如何使用el-table遍歷循環(huán)表頭和表體數(shù)據(jù)，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-04-04
這篇文章主要介紹了vue中的非父子間的通訊問題簡單的實(shí)例代碼,需要的朋友可以參考下2017-07-07
vue跳轉(zhuǎn)頁面的幾種常用方法實(shí)例總結(jié)
Vue是一種流行的JavaScript框架,用于構(gòu)建用戶界面,在Vue中,頁面跳轉(zhuǎn)通常使用路由(Router)來實(shí)現(xiàn),除此之外還有很多方法,這篇文章主要給大家介紹了關(guān)于vue跳轉(zhuǎn)頁面的幾種常用方法,需要的朋友可以參考下2024-05-05
這篇文章主要為大家詳細(xì)介紹了Vue.js創(chuàng)建Calendar日歷效果的過程，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-11-11