今天就跟大家聊聊有關(guān)vue keep-alive實(shí)現(xiàn)多組件嵌套中個(gè)別組件存活不銷毀的方法,可能很多人都不太了解,為了讓大家更加了解,小編給大家總結(jié)了以下內(nèi)容,希望大家根據(jù)這篇文章可以有所收獲。

配置路由加以判斷是否使用keep-alive
MVideoUpload,MFileUpload為上傳文件組件,故想之存活,而其他組件則需要掛起刷新數(shù)據(jù),但由于MVideoUpload,MFileUpload分別嵌套在MVideos,MFiles組件中,為了保證跳轉(zhuǎn)其他模塊組件的時(shí)候,上傳視頻和上傳文件的模塊不銷毀(因?yàn)橐坏└附M件銷毀,子組件自然也銷毀了),所以兩個(gè)父組件也需要存活,只是之后需要再加以判斷存活那幾個(gè)子組件。
路由js:
{
path:'resource',
name:'MResource',
meta:{
auth:true //是否需要登錄
},
component: () => import('../pages/manage/resource/Resource'),
children:[
{
path: 'videos',
name: 'MVideos',
meta:{
keepAlive:true, //包含存活組件
auth:true //是否需要登錄
},
component: () => import('../pages/manage/resource/videos/Videos'),
children:[
{
path:'list',
name:'MVideoList',
meta:{
auth:true //是否需要登錄
},
component: () => import('../pages/manage/resource/videos/VideosList'),
},
{
path:'upload',
name:'MVideoUpload',
meta:{
keepAlive:true, //需要存活
auth:true //是否需要登錄
},
component: () => import('../pages/manage/resource/videos/UploadVideo'),
},
{
path:'update',
name:'MVideoUpdate',
meta:{
auth:true //是否需要登錄
},
component: () => import('../pages/manage/resource/videos/UpdateVideo'),
},
{
path:'detail',
name:'MVideoDetail',
meta:{
auth:true //是否需要登錄
},
component: () => import('../pages/manage/resource/videos/VideoDetail'),
},
],
redirect:{name: 'MVideoList'}
},
{
path:'files',
name:'MFiles',
meta:{
keepAlive:true, //包含存活組件
auth:true //是否需要登錄
},
component: () => import('../pages/manage/resource/files/Files'),
children:[
{
path: 'list',
name: 'MFileList',
meta:{
auth:true //是否需要登錄
},
component: () => import('../pages/manage/resource/files/FilesList'),
},
{
path:'upload',
name:'MFileUpload',
meta:{
keepAlive:true, //需要存活
auth:true //是否需要登錄
},
component: () => import('../pages/manage/resource/files/UploadFile'),
},
{
path:'update',
name:'MFileUpdate',
meta:{
auth:true //是否需要登錄
},
component: () => import('../pages/manage/resource/files/UpdateFile'),
},
{
path:'detail',
name:'MFileDetail',
meta:{
auth:true //是否需要登錄
},
component: () => import('../pages/manage/resource/files/FileDetail'),
},
],
redirect:{name: 'MFileList'}
},
],
redirect:{name: 'MFiles'}
},
文章題目:vuekeep-alive實(shí)現(xiàn)多組件嵌套中個(gè)別組件存活不銷毀的方法-創(chuàng)新互聯(lián)
瀏覽路徑:http://chinadenli.net/article20/cogico.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供虛擬主機(jī)、域名注冊、面包屑導(dǎo)航、企業(yè)建站、動態(tài)網(wǎng)站、網(wǎng)站內(nèi)鏈
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容