資訊專欄INFORMATION COLUMN
摘要：從第二頁(yè)返回首頁(yè)時(shí)為只處理設(shè)置了路由元信息的組件簡(jiǎn)單的分享給大家，希望可以幫到你們
剛剛解了一個(gè)詳情返回列表時(shí)候，列表高度保持在點(diǎn)擊進(jìn)去的詳情的問(wèn)題，特此做個(gè)分享，希望大家碰到類似的問(wèn)題可以直接一遍過(guò)，不用卡殼（因?yàn)檫@個(gè)在實(shí)際項(xiàng)目開(kāi)發(fā)中經(jīng)常會(huì)用到所以分享了出來(lái)）
Vue api 是這樣說(shuō)的 api鏈接傳送門
dome是這樣的
經(jīng)過(guò)詳細(xì)查看 （話不多說(shuō)，貼代碼）
scrollBehavior (to, from, savedPosition) {
if(savedPosition) {
setTimeout(() => {
window.scrollTo(savedPosition.x, savedPosition.y)
}, 200)
}
}
或者結(jié)合keep-alive來(lái)達(dá)到后退時(shí)不刷新數(shù)據(jù)，前進(jìn)時(shí)刷新數(shù)據(jù)的效果。
new VueRouter({
mode: "history",
routes: [{
path: "/foo",
component: (resolve) => {
require(["views/foo"], resolve)
},
meta: {isKeepAlive: true}
}],
scrollBehavior (to, from, savedPosition) {
if (savedPosition || typeof savedPosition == "undefined") { //從第二頁(yè)返回首頁(yè)時(shí)savePosition為undefined
//只處理設(shè)置了路由元信息的組件
from.meta.isKeepAlive = typeof from.meta.isKeepAlive == "undefined" ? undefined : false;
to.meta.isKeepAlive = typeof to.meta.isKeepAlive == "undefined" ? undefined : true;
if(savedPosition) {
return savedPosition;
}
} else {
from.meta.isKeepAlive = typeof from.meta.isKeepAlive == "undefined" ? undefined : true;
to.meta.isKeepAlive = typeof to.meta.isKeepAlive == "undefined" ? undefined : false;
}
}
})
簡(jiǎn)單的分享給大家，希望可以幫到你們
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/52707.html
摘要：從第二頁(yè)返回首頁(yè)時(shí)為只處理設(shè)置了路由元信息的組件簡(jiǎn)單的分享給大家，希望可以幫到你們 剛剛解了一個(gè)詳情返回列表時(shí)候，列表高度保持在點(diǎn)擊進(jìn)去的詳情的問(wèn)題，特此做個(gè)分享，希望大家碰到類似的問(wèn)題可以直接一遍過(guò)，不用卡殼（因?yàn)檫@個(gè)在實(shí)際項(xiàng)目開(kāi)發(fā)中經(jīng)常會(huì)用到所以分享了出來(lái)） Vue api 是這樣說(shuō)的 api鏈接傳送門 showImg(https://segmentfault.com/img/b...
摘要：用開(kāi)發(fā)仿旅游站項(xiàng)目總結(jié)上該說(shuō)的話，該表明的上篇已經(jīng)表明了。之后的路由切換不再請(qǐng)求數(shù)據(jù)是因?yàn)榻M件內(nèi)容是從內(nèi)存取了不會(huì)再重新創(chuàng)建了，對(duì)應(yīng)的鉤子函數(shù)不會(huì)再執(zhí)行了。此時(shí)，通過(guò)新增的生命周期鉤子函數(shù)以及這個(gè)緩存值就實(shí)現(xiàn)了我們要的功能了。 用Vue開(kāi)發(fā)仿旅游站webapp項(xiàng)目總結(jié) （上）該說(shuō)的話，該表明的上篇已經(jīng)表明了。謝謝上篇評(píng)論區(qū)一些同學(xué)~ 很鼓勵(lì)我，不過(guò)下下篇估計(jì)沒(méi)了，這篇總結(jié)完，下下篇可...
摘要：用開(kāi)發(fā)仿旅游站項(xiàng)目總結(jié)上該說(shuō)的話，該表明的上篇已經(jīng)表明了。之后的路由切換不再請(qǐng)求數(shù)據(jù)是因?yàn)榻M件內(nèi)容是從內(nèi)存取了不會(huì)再重新創(chuàng)建了，對(duì)應(yīng)的鉤子函數(shù)不會(huì)再執(zhí)行了。此時(shí)，通過(guò)新增的生命周期鉤子函數(shù)以及這個(gè)緩存值就實(shí)現(xiàn)了我們要的功能了。 用Vue開(kāi)發(fā)仿旅游站webapp項(xiàng)目總結(jié) （上）該說(shuō)的話，該表明的上篇已經(jīng)表明了。謝謝上篇評(píng)論區(qū)一些同學(xué)~ 很鼓勵(lì)我，不過(guò)下下篇估計(jì)沒(méi)了，這篇總結(jié)完，下下篇可...
閱讀 1222·2021-08-12 13:24
閱讀 3052·2019-08-30 14:16
閱讀 3367·2019-08-30 13:01
閱讀 2119·2019-08-30 11:03
閱讀 2824·2019-08-28 17:53
閱讀 3137·2019-08-26 13:50
閱讀 2314·2019-08-26 12:00
閱讀 1005·2019-08-26 10:38
