路由元信息
- 增加
keepAlive:true , scrollTop: {top: 0}
,
{
path: '/**/**',
name: '**',
component: () => import('@/views/**/index.vue'),
meta: {
title: '**',
affix: false,
keepAlive: true,
scrollTop: { // 记录一些使用信息
top: 0, // 滚动条的位置
},
},
},
}
离开时记录页面中表格滚动条的位置
router.beforeEach(async (to, from, next) => {
// 离开页面时,记录滚动条位置
// 获取滚动元素id
const $content = document.getElementById('app')
if ($content) {
// 获取高度
const _curScrollTop = $content.scrollTop
// 存入meta
from.meta.scrollTop = _curScrollTop
}
页面激活时,给页面赋值,滚动高度
// 进入页面时,滚动到指定位置
// 获取滚动元素
const $content = document.getElementById('app')
// 设置滚动条
$content.scrollTop = this.$route.meta.scrollTop
知识点
- 获取id元素
const clsssElement = document.getElementById('.xxx');
- 获取class元素
const clsssElement = document.querySelector('.xxx');
标签:content,vue,const,滚动条,meta,scrollTop,页面
From: https://www.cnblogs.com/tlf01/p/18420927