51CTO首页
AI.x社区
博客
学堂
精品班
软考社区
免费课
企业培训
鸿蒙开发者社区
信创认证
公众号矩阵
移动端
视频课 免费课 排行榜 短视频 直播课 软考学堂
全部课程 软考 信创认证 华为认证 厂商认证 IT技术 PMP项目管理 免费题库
在线学习
文章 资源 问答 课堂 专栏 直播
51CTO
鸿蒙开发者社区
51CTO技术栈
51CTO官微
51CTO学堂
51CTO博客
CTO训练营
鸿蒙开发者社区订阅号
51CTO软考
51CTO学堂APP
51CTO学堂企业版APP
鸿蒙开发者社区视频号
51CTO软考题库
CKA（Kubernetes 管理员认证）精品班
按照企业k8s需求进行技能培训，帮助用户快速拿下CKA认证，K8S采用新版本进行授课，课程内容全、讲解详细 。 免费试学
软考高级：系统架构设计师精品班
根据考试大纲对知识点、高频考点进行深入讲解，传授答题技巧及判断标准，助力高效备考。 免费试学
信创认证：系统架构师精品班（高级）
信息技术应用创新人才考试评价 免费试学

java保存vue前端路由路由菜单 vue路由跳转 保存状态
本文很长，请耐心看完分析。4.高级用法，指定从什么组件进入才缓存，以及销毁缓存：先介绍我发现的网上一些博主写的有bug的方法，在介绍自己的方法。 假设这里有 3 个路由： A、B、C。要求：　　1.   默认显示 A    　　2.  B 跳到 A，A 不刷新 　　3.  C 跳到 A，A 刷新先上一些发现博
java保存vue前端路由路由菜单
缓存
动态控制
Vue
转载
智能开发艺术家
2024-04-28 22:35:34
250阅读

vue 路由数据获取+路由滚动+懒加载
#数据获取简单例子 create函数会在组件创建完毕后调用 <template> <div class="post"> <div v-if="loading"> Loading </div> <div v-if="post"> <h2>{{post.title}}</h2> <p>{{post.bo ...
获取数据
数据获取
懒加载
数据
数据加载
转载
mob604756fbd94e
2021-07-28 21:35:00
251阅读
2评论

vue与react当路由页面跳转时滚动位置不对的处理
在我们开发react或者vue项目的时候会发现当切换路由进行页面跳转的时候如果在前一个页面将滚动条滚到了最下面然后进行跳转那么接下来的那个页面也会默认滚动在最下面。这个时候我们就需要处理一下。在处理之前我们首先需要知道原因在哪里：原因是因为虚拟dom的算法问题，导致不会更新scroll解决方法：在你的外层框架监听history.location.pathname的变化，只要变了那就将b...
路由页面
路由页面scroll处理
路由跳转滚动距离的处理
项目代码
解决方法
原创
A吴迪网络工作室
2022-03-21 14:20:56
1534阅读

vue与react当路由页面跳转时滚动位置不对的处理
在我们开发react或者vue项目的时候会发现当切换路由进行页面跳转的时候如果在前一个页面将滚动条滚到了最下面然后进行跳转那么接下来的那个页面也会默认滚动在最下面。这个时候我们就需要处理一下。在处理之前我们首先需要知道原因在哪里：原因是因为虚拟dom的算法问题，导致不会更新scroll解决方法：在你的外层框架监听history.location.pathname的变化，只要变了那就将b...
react教程
react学习
原创
A吴迪网络工作室
2021-06-18 16:45:17
880阅读

vue ios 滚动到指定位置
# Vue中实现iOS设备滚动到指定位置的指南 在Vue应用中实现在iOS设备上滚动到指定位置并不是一件复杂的事情，然而由于各种原因（如：浏览器的默认行为、触控事件等），你可能会遇到一些小挑战。在这篇文章中，我将教你如何在Vue中实现这一功能，并且详细解释每一个步骤。 ## 整体流程 首先，我们来明确实现这一功能的整体步骤。以下是步骤的概要，使用表格展示： | 步骤 | 描述
Vue
指定位置
生命周期
原创
mob64ca12db7156
8月前
103阅读

vue 设置ios滚动条样式 vue设置滚动条位置
在文档页面(http://localhost:8080/document)拉动滚动条，然后刷新浏览器会发现滚动条依然在原来的位置，这是浏览器的默认行为，会记录浏览器滚动条默认位置。但是点击浏览器“前进/后退”按钮，会发现当初那个页面的滚动条从0开始了，没有记录上一次滚动条的位置。现在要求点击浏览器“前进/后退”按钮，页面滚动条要记录上一次的位置，这时需要设置它的的滚动行为。这时候需要在路由配置中设
vue 设置ios滚动条样式
vue 固定div 滚动
ide
App
路由配置
转载
代码工匠传奇
2024-01-04 21:41:39
89阅读

antdesign vue prolayout 路由滚动条 vue动态路由导航菜单
  使用场景：用户登录后获取菜单列表，然后动态添加路由和菜单，实现根据用户权限实现动态添加路由。昨天搞了半个晚上一直困惑使用(Router.addRoutes)在路由拦截器里，一直问题，今天早上到了公司，咨询了下老大和一个前段大佬终于搞定了，直接上代码了login.vue（登录界面）import { resetRouter } from "@/router" async login()
动态添加
数据
缓存
转载
flyingsmiling
2024-07-23 13:17:09
429阅读

antdesign vue 锚点不跳转路由 滚动自动定位到锚点位置
实际企业项目开发中，如何基于Vue2，利用锚点实现元素区域滚动定位实际企业项目开发中，如何基于Vue2，利用锚点实现元素区域滚动定位。项目需求点击左菜单，实现右边内容区域滚动定位；管理页，可以预览该页，并根据预览内容的id定位到滚动区域；需求分析并实现需求一：点击左菜单，实现右边内容区域滚动定位1、如果你使用的是ant-design Vue UI库，是可以使用自带的锚点组件的<templat
vue.js
前端
javascript
锚点
选择器
转载
数据分析家
7月前
612阅读

vue 改变div的滚动条位置
在vue里要改变div的 滚动条<ul ref="ulScroll1"></ul>this.$refs.ulScroll1.scrollLeft=15 //距离左 横滚动条this.$refs.ulScroll1.scrolltop=15 //距离右 竖滚动条这里会出现一个问题是 我们的数据是动态获取的这里设置了 滚动条 会没有任何变化那是因为 数据会没有渲染出来 滚动条还未出现解决的办法就是 在请求完数据后 做一个定时器 延迟一下 滚动条的设置 100
vue
数据
Java
原创
Mr_wuying
2022-01-10 13:54:58
2798阅读

[vue] 页面滚动到指定位置 scrollIntoView
滚动
javascript
原创
533_
2022-12-21 10:24:23
1245阅读

vue3 获取整个滚动容器的高度 vue滚动事件获取元素位置
VUE根据ref来获取元素or组件的滚动条位置。需求分析滚动条根据展示块的滑动来变更长度or位置解决方法思路1.编写原生js代码：mounted () { window.addEventListener('scroll', this.handleScroll) }, methods:{ handleScroll () { var scrol
vue3 获取整个滚动容器的高度
前端
vue
当前对象
css
转载
IT智行领袖
2024-07-02 23:29:27
3620阅读

vue2怎么监控是否滚动到最底部 vue记录滚动条位置
Vue记住滚动条位置1. 先给占位符加一层缓存2. 在路由上加一个源信息meta，记录滚动条的top值3. 使用 scrollBehavior4. 给页面添加事件监听 使用前端路由，当切换到新路由时，想要页面滚到顶部，或者是保持原先的滚动位置，就像重新加载页面那样。 vue-router 可以自定义路由切换时页面如何滚动。注意：这个功能只在支持history.pushState的浏览器中可用1.
vue2怎么监控是否滚动到最底部
vue.js
前端
javascript
事件监听
转载
mob64ca14092155
2024-03-28 14:17:50
725阅读

Vue Router 记住页面滚动位置的简单实现
非常实用
html
读取数据
生命周期
转载
wx6332e0803afcf
2022-11-08 13:37:31
194阅读

Vue Router 记住页面滚动位置的简单实现
本质就是, 利用内置组件<keep-alive>在页面组件得以被缓存的基础上, 再加以document.documentElement.scrollTop获取滚动距离, 后返回页面时恢复滚动距离 实现效果, 打开A页面, 滚动至a处, 切换至B页面, 返回A页面, 此时页面位置为a点而非顶部 路由出 ...
vue
小实现
参考资料
读取数据
生命周期
转载
mb5fe1902d5617a
2021-11-02 22:00:00
1224阅读
2评论

vue滚动
1、监听滚动事件利用VUE写一个在控制台打印当前的scrollTop,首先，在mounted钩子中给window添加一个滚动滚动监听事件，mounted(){window.addEventListener('scroll',this.handleScroll)},然后在方法中，添加这个handleScroll方法handleScroll(){varscrollTop=window.
vue
scrollTop
原创
梦想代码
2019-02-21 10:41:17
1455阅读

vue3路由切换页面滚动条位置重置回顶部
1.vue单个页面跳转时： 在此页面上mounted方法中设置滚动条的方法// 切换页面时滚动条自动滚动到顶部 window.scrollTo(0,0); }2.全部页面，使用路由的钩子函数中设置(在router中main.js) window.scrollTo(0,0); // chrome document.body.scrollTop = 0 // firefox document.docu
firefox
chrome
页面跳转
原创
北风之神zzl
2024-03-15 17:07:56
2529阅读

vue ios滚动 vue实现滚动效果
1、首先， 整体为一个div，滚动效果在div内部实现，每个数据为一个单独的li。<div id="scroll" :v-model="dataPopRadio" class="solidUl" @scroll="scrollChange"> <ul> <li v-for="(item
vue ios滚动
前端
javascript
vue.js
ci
转载
网络智叶
2023-12-27 10:02:37
200阅读

ios vue 不滚动 vue滚动播放
<template> <div class="list" id="list"> <div class="cc rowup"> </div> </div> </template> <script> export default { components: {}, data () {
ios vue 不滚动
css
html
数据
转载
mob64ca14101b2f
2024-01-26 10:03:53
48阅读

vue-cli学习-路由滚动和懒加载
####滚动行为 滚动行为，即当跳转到新路由组件时，在有足够高度的情况下会记住当前位置 有时，不需要记住当前位置，直接让它 top，或者指位置 const router = new VueRouter({ mode : 'history', routes, scrollBehavior(to, ...
懒加载
加载
IT
转载
mb5ff5901795aaf
2021-09-22 17:21:00
170阅读
2评论

vue3 路由设置滚动条置顶
const router = createRouter({ history: createWebHistory(), routes, // 跳转路由后导航栏置顶 scrollBehavior(to, from, saveScrollPosition) { return { left: 0, top: 0 }; },});
vue
router
route
导航栏
置顶
原创
开源字节
2022-11-01 16:31:18
671阅读
  • 1
  • 2
  • 3
  • 4
  • 5
精品课程领资料
免费资料>
2025软考
系统架构设计师 系统规划与管理师 软件设计师 系统集成项目管理工程师
信创认证
系统架构师 信创集成项目管理师 信创规划管理师 系统开发工程师
厂商认证
CKA/CKS架构师 红帽认证工程师 Oracle-OCP认证 Oracle-OCM认证
IT技术
数据库高级工程师 AIGC大模型实战 Linux云计算架构师 Python全栈开发
华为认证
数通HCIP认证 云计算HCIE认证 华为存储HCIE认证 HCIP安全认证
相关文章

vue ios局部滚动防止全屏滚动 vue 滚动显示

如何保存ListView上次的滚动条的位置（转）

ios vue 滚动条 vue 全屏滚动

vue 模仿ios 时间滚动 vue滚动事件

056——VUE中vue-router之路由参数的验证处理保存路由安全

保存位置信息 android 手机保存位置

jquery 滚动到指定位置 jq滚动条滚动指定位置

[vue] 无缝滚动 vue-seamless-scroll 滚动表格

iOS 设置滚动位置

jquery获取滚动位置

Copyright © 2005-2025 51CTO.COM 版权所有 京ICP证060544号

关于我们
官方博客 全部文章 热门标签 班级博客
了解我们 网站地图 意见反馈
友情链接
鸿蒙开发者社区 51CTO学堂
51CTO 软考资讯