vue移动端解决返回主页缓存滚动条不重置顶部的问题-程序员宅基地

技术标签: 移动端  

在这里插入图片描述

我的项目是有一个带有滚动条的列表数据,当滚动条滑动好几页之后点击其中一条数据进入详情页之后,在详情页有返回按钮,返回的时候希望还在当前位置,而不是重置到顶部,对用户体验及其不好,试了好多种方法,最终也是实现啦,话不多说看代码吧

… 首先为需要保留滚动条的组件开启缓存,在 router.js 中写上如下代码:

export default new Router({
   
    
  mode: 'history',
  routes: [
    {
   
    
      path: '/',
      component: shenpi
    },
    {
   
    
      path: '/submit',
      name: 'submit',
      component: submit,
      meta: {
   
    
        requireAuth: true
      },
    },
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/hong521520/article/details/106835184

智能推荐

Linux 格式化分区 报错Could not stat --- No such file or directory 和 partprobe 命令_couldn't stat remote file: no such file or directo-程序员宅基地

文章浏览阅读3.2w次,点赞5次,收藏11次。 安装操作系统的时候,有一部分空间没有使用,在系统安装后,准备重新分区并格式化,在挂到/u01 下,来安装Oracle的。 分区的过程正常:[root@db1 /]# fdisk -l Disk /dev/sda: 21.4 GB, 21474836480 bytes255 heads, 63 sectors/track, 2610 cylindersUnits = cyl_couldn't stat remote file: no such file or directory

支付宝手机网站支付接口:暂时无法获取订单信息,请稍后再试。_获取不到支付宝接口订单号-程序员宅基地

文章浏览阅读2.5k次。问题分析:无法获取订单,是获取订单信息有误,从订单名称,付款金额,商品描述几个必填参数排查,发现订单金额存在问题_获取不到支付宝接口订单号

问题小记之 使用 nil 索引 Lua table_table index is nil-程序员宅基地

文章浏览阅读3k次。本文简单介绍了使用 nil 索引 Lua table 的一些问题使用 Lua 已经不少时间了,遇到 “table index is nil” 的错误也很多次了,久而久之自己便形成了 Lua table 索引不能为 nil 的概念.但实际上,上述概念是不准确的,虽然下面的 Lua 代码确实会引起 “table index is nil” 的错误:local t = {}-- use ni..._table index is nil

python-qbittorrent库下载电影学习记录(含基本使用和常用函数)_qbittorrent python-程序员宅基地

文章浏览阅读4.4k次,点赞3次,收藏11次。最近因为一些需求,爬了一个带有magnet磁力链接的网站(如果有对怎么爬感兴趣可以说一声,这个文章基本只是为了当成自己的学习记录用哒,也会基于爬完的数据库开始做下一步),大致的结构是每个影片有自己的名字和他人分享的一系列magnet链接,需要批量下载这些磁力链接到本地然后归档。作为一个业余程序员当然不能直接一个一个手动下载了。于是就考虑用python来简化这个工作。 经过测试发现这一系列magnet中有的是连接不上的(用qbittorrent会一直卡在检索元数据的位置),但..._qbittorrent python

Python Selenium防检测_python selenium反侦测-程序员宅基地

文章浏览阅读1.6k次,点赞5次,收藏18次。selenium webdriver防检测有的一些网站在使用Selenium的时候会有前端的检测,所以我们要避免这种检测。from selenium.webdriver import Chromedriver = Chrome('./chromedriver')driver.execute_cdp_cmd("Page.addScriptToEvaluateOnNewDocument", { "source": """ Object.defineProperty(navigator,_python selenium反侦测

【Python】英文文本分词与词频统计(split()函数、re库)_python 英文分词-程序员宅基地

文章浏览阅读1.8w次,点赞6次,收藏74次。英文文本分词1、知识准备(1)Python中的split()函数的用法了解split()的基本用法(2)python多个分割符split字符串了解re库的部分用法Python strip() 方法用于移除字符串头尾指定的字符(默认为空格或换行符)或字符序列。注意:该方法只能删除开头或是结尾的字符,不能删除中间部分的字符。2、实践代码将英文句子分词,并记录通过字典的方式记录每个..._python 英文分词

随便推点

avr模拟串口通讯c语言,串口通信USART-AVR程序代码-程序员宅基地

文章浏览阅读698次。以前学习AVR时候写的程序,分享一下#include#include#defineRXB81#defineTXB80#defineUPE2#defineOVR3#defineFE4#defineUDRE5#defineRXC7#defineFRAMING_ERROR(1<#definePARITY_ERROR(1<#defineDATA_OVERR..._avr txb80

vue学习三:vue的生命周期_三个生命周期 vue-程序员宅基地

文章浏览阅读256次。Vue生命周期: 什么是生命周期:从Vue实例创建、运行、到销毁期间,总是伴随着各种各样的事件,这些事件,统称为生命周期!生命周期钩子:就是生命周期事件的别名而已;生命周期钩子 = 生命周期函数 = 生命周期事件主要的生命周期函数分类:创建期间的生命周期函数: beforeCreate:实例刚在内存中被创建出来,此时,还没有初始化好 data 和 methods 属性..._三个生命周期 vue

[Unity3D]利用DoTween制作卡牌翻转的效果_unity2d卡牌翻面-程序员宅基地

文章浏览阅读1.1k次。转载自注明: https://blog.csdn.net/wayway0554/article/details/84554886 1. 卡牌翻转效果利用Unity的UGUI制作了2D卡牌翻转的效果,如果是sprite对象的话,原理应该也是一样的,以下是效果图图1 卡牌翻转效果2. 关于DoTweenDoTween是一款十分强大且好用的动画效果插件,有免费版和..._unity2d卡牌翻面

强化学习 时序差分学习(Temporal-Difference Learning)_temporal-difference 实例-程序员宅基地

文章浏览阅读1.2k次,点赞2次,收藏6次。时序差分学习是一种通过时序自举(bootstrap)的方式采样数据,通过最小化差分更新参数的一种model-free学习方法。根据Expected Return的不同近似方法,分为one-step、n-step、TD(λ)、蒙特卡洛方法等。_temporal-difference 实例

SqlServer2017 AlwaysOn 读写分离 无域控_sqlserver always on-程序员宅基地

文章浏览阅读3.6k次,点赞2次,收藏19次。一、说明配置环境Windows server 2019SqlServer 2017设备PC1(主节点):JF-SQLDB01IP地址 192.168.50.199PC2(节点):orangePCIP地址 192.168.50.230PC3(节点):pearPCIP地址 192.168.50.18PC4(测试机):DESKTOP-46PCO3Q群集名及侦听规划Windows群集名称:jfqun可用性组名称:SQLAGSQL..._sqlserver always on

Vue打包并自动部署到指定服务器_vue deploy-程序员宅基地

文章浏览阅读947次。Vue打包并自动部署到指定服务器_vue deploy

推荐文章

热门文章

相关标签