關(guān)于vue3.0中的this.$router.replace({ path: '/'})刷新無效果問題
更新時間：2020年01月16日 10:50:49 作者：8戰(zhàn)魂無雙8
這篇文章主要介紹了關(guān)于vue3.0中的this.$router.replace({ path: '/'})刷新無效果問題，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
首先在store中定義所需要的變量可以進行初始化，再定義一個方法，登錄成功后A頁面，跳轉(zhuǎn)到B頁面之前，需要直接調(diào)用store中存儲數(shù)據(jù)的方法，全局可以使用
諸如以上所示，該問題，百度了好久，多虧群里大佬。
vue使用less報錯的解決方法 安裝less less-loader
cnpm install less less-loader --save-dev
app.vue是所有XXX.vue文件的根文件
所以webapp,的底部通常是在這里配置
h5的新增
<header>標題</header>
<main>主題內(nèi)容</main>
<footer>固定的底部內(nèi)容</footer>
所以底部通常不使用footer
元素在最底部水平排列
<div class="myfooterbox">
<div>外賣</div>
<div>搜索</div>
<div>訂單</div>
<div>我的</div>
</div>
.myfooterbox {
width: 100%;
display: flex;
justify-content: space-between;
position: fixed;
bottom: 0;
left: 0;
}
ps==>如果元素的寬度是自身的寬度。
justify-content: space-between;可能是是沒有效果的。
點擊路由跳轉(zhuǎn)
this.$router.push({ path: "/search" });
給當前點擊的元素添加背景色 同樣是借助三目運算 如果是true 添加某一個類
.on {
background: pink;
}
<div @click="handlersell" :class="{ on: '/' === $route.path }">外賣</div>
<div @click="handlersearch" :class="{ on: '/search' === $route.path }">搜索</div>
路由跳轉(zhuǎn)
<div @click="handlersell" :class="{ on: '/' === $route.path }">外賣</div>
<div @click="handlersearch" :class="{ on: '/search' === $route.path }">搜所 </div>
methods: {
handlersell() {
this.$router.push({ path: "/" });
},
handlersearch() {
this.$router.push({ path: "/search" });
},
}
優(yōu)化后 使用了replace
<div @click="handlergo('/')" :class="{ on: '/' === $route.path }">外賣</div>
<div @click="handlergo('/search')" :class="{ on: '/search' === $route.path }" >搜索</div>
handlergo(path) {
this.$router.replace(path);
}
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
Vue使用Element-UI實現(xiàn)分頁效果全過程
element-ui官網(wǎng)上有分頁實現(xiàn)的功能,簡單方便又好用,也有很多分頁的樣式,你可以根據(jù)需要去選擇自己想要的樣式,下面這篇文章主要給大家介紹了關(guān)于Vue使用Element-UI實現(xiàn)分頁效果的相關(guān)資料,需要的朋友可以參考下2023-04-04
這篇文章主要為大家介紹了Vue組件的創(chuàng)建和使用，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助2021-12-12
Vue項目引用百度地圖并實現(xiàn)搜索定位等功能(案例分析)
這篇文章主要介紹了Vue項目引用百度地圖并實現(xiàn)搜索定位等功能(案例分析),本篇文章為案例分析，技術(shù)點較多，所以篇幅較長，認真閱覽的你一定會學(xué)到很多知識，需要的朋友可以參考下2022-09-09
本篇文章主要介紹了vue 掛載路由到頭部導(dǎo)航的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-11-11
這篇文章主要介紹了Vue項目如何改變屏幕尺寸重新刷新頁面-計算頁面尺寸，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-09-09
vue框架提供了前端開發(fā)組件的思想，可以通過組件來組合成一個完整的頁面，都是隨著組件數(shù)量原來越多，組件之間難免需要相互通信。本文將為大家介紹四種組件間的通信方式，需要的可以參考一下2022-01-01
Vue項目使用localStorage+Vuex保存用戶登錄信息
這篇文章主要為大家詳細介紹了Vue項目使用localStorage+Vuex保存用戶登錄信息，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-05-05
基于Vue實現(xiàn)后臺系統(tǒng)權(quán)限控制的示例代碼
本篇文章主要介紹了基于Vue實現(xiàn)后臺系統(tǒng)權(quán)限控制的示例代碼，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-08-08
vue項目實現(xiàn)點擊目標區(qū)域之外可關(guān)閉(隱藏)目標區(qū)域
這篇文章主要介紹了vue項目實現(xiàn)點擊目標區(qū)域之外可關(guān)閉(隱藏)目標區(qū)域，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-03-03
這篇文章主要為大家詳細介紹了Vue.JS入門教程之自定義指令,具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-12-12