vue-router4 (七) 滚动行为(scrollBehavior )

应用场景:

从A组件进入B组件,再返回A组件后,想让A组件的页面回到进入B组件前的位置,或者自动刷新回到A组件顶部,就需配置路由的滚动行为(scrollBehavior )。

①返回A组件时,让A组件回到进入B组件前的位置,路由配置:

const router = createRouter({history:createWebHistory(),  //路由模式routes,   //路由配置项//滚动行为scrollBehavior (to, from, savedPosition) {//console.log(savedPosition);if (savedPosition) {return savedPosition} else {return{top:0,left:0}}}})

②返回A组件时,让A组件自动刷新回到顶部:

 scrollBehavior (to, from, savedPosition) {return{top:0,left:0}
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/709701.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

webrtc

stun服务 阿里云服务器安全组添加端口开放 webrtc-streamer视屏流服务器搭建 - 简书

Prometheus-监控远程linux的主机

一、本地访问 1、访问 http://8.137.122.212:9090/2、查看监控的主机 默认只监控了本机一台主机 这里的IP地址原本是‘localhost’,为了方便我将‘localhost’换成了主机的IP地址 现在看只监控了本机一台主机 3、查看监控数据 通过http://8.137.122.212:9090/m…

RT-Thread studio上创建一个STM32F103的CAN通讯功能

前言 (1)如果有嵌入式企业需要招聘湖南区域日常实习生,任何区域的暑假Linux驱动实习岗位,可C站直接私聊,或者邮件:zhangyixu02gmail.com,此消息至2025年1月1日前均有效 (2&#xff0…

学Python如此简单--用Python实现一个超简单的学生信息管理系统

简介 系统名称:番茄系统 实现功能:增删查改 运用技术:python基础 代码 import time student_all [] print(欢迎进入番茄系统.center(30)) print(**36,end) while True:pee 请选择功能:1、添加学生2、删除学生3、修改学生4、…

1.1 编程环境的安装

汇编语言 汇编语言环境部署 第二个运行程序直接双击安装一直下一步即可MASM文件复制到D盘路径下找到dosbox安装路径:C:\Program Files (x86)\DOSBox-0.74找到该文件双击打开它,修改一下窗口大小 把这两行改成如下所示 运行dos,黑框中输入mou…

C#,数值计算,求解微分方程的吉尔(Gear)四阶方法与源代码

1 微分方程 微分方程,是指含有未知函数及其导数的关系式。解微分方程就是找出未知函数。 微分方程是伴随着微积分学一起发展起来的。微积分学的奠基人Newton和Leibniz的著作中都处理过与微分方程有关的问题。微分方程的应用十分广泛,可以解决许多与导数…

RTCA DO-178C 机载系统和设备认证中的软件注意事项-软件配置管理流程(七)

7.0 软件配置管理流程 SOFTWARE CONFIGURATION MANAGEMENT PROCESS 本节讨论软件配置管理 (SCM) 过程的目标和活动。 SCM 流程按照软件计划流程(参见 4)和软件配置管理计划(参见 11.4)的定义进行应用。 SCM 过程的输出记录在软件…

【探索AI】Sora - 探索AI视频模型的无限可能

Sora - 探索AI视频模型的无限可能 随着人工智能技术的飞速发展,AI视频模型已成为科技领域的新热点。而在这个浪潮中,OpenAI推出的首个AI视频模型Sora,以其卓越的性能和前瞻性的技术,引领着AI视频领域的创新发展。让我们将一起探讨…

【Web安全靶场】sqli-labs-master 21-37 Advanced-Injection

sqli-labs-master 21-37 Advanced-Injection 第一关到第二十关请见专栏 文章目录 sqli-labs-master 21-37 Advanced-Injection第二十一关-Cookie注入第二十二关-Cookie注入第二十三关-注释符过滤的报错注入第二十四关-二次注入第二十五关-过滤OR、AND双写绕过第二十五a关-过滤…

老卫带你学---leetcode刷题(190. 颠倒二进制位)

190. 颠倒二进制位 问题 颠倒给定的 32 位无符号整数的二进制位。 提示: 请注意,在某些语言(如 Java)中,没有无符号整数类型。在这种情况下,输入和输出都将被指定为有符号整数类型,并且不应…

《Flask入门教程》学习笔记

《Flask入门教程》官网:https://tutorial.helloflask.com/ 目录 第一章:准备工作第二章:Hello, Flask!第三章:模板第四章:静态文件第五章:数据库第六章:模板优化第七章:表单第八章&a…

【嵌入式——QT】日期与定时器

日期 QTime:时间数据类型,仅表示时间,如 16:16:16;QDate:日期数据类型,仅表示日期,如2024-1-22;QDateTime:日期时间数据类型,表示日期和时间,如2…

多个版本的Python如何不冲突?

转载文章,防止忘记或删除 转载于:电脑中存在多个版本的Python如何不冲突? - 知乎 (zhihu.com) 如何安装多版本的Python并与之共存? 如果你的工作涉及到Python多版本之间开发或测试,那么请收藏本文, 如果你…

【python】Python Turtle绘制流星雨动画效果【附源码】

在这篇技术博客中,我们将学习如何使用 Python 的 Turtle 模块绘制一个流星雨的动画效果。通过简单的代码实现,我们可以在画布上展现出流星闪耀的场景,为视觉带来一丝神秘与美感。 一、效果图: 二、准备工作 (1)、导入…

每日一题——LeetCode1544.整理字符串

方法一 字符串转数组删除元素 将字符串转为数组&#xff0c;遍历数组&#xff0c;如果碰到同一字母大写小写连续出现就原地删除这两个元素&#xff0c;最后把数组转回字符串并返回 var makeGood function(s) {let arrs.split()for(let i0;i<s.length-1;i){if(arr[i]!arr[…

【程序员的金三银四求职宝典】《春风拂面,代码在手:程序员的金三银四求职指南》

《春风拂面&#xff0c;代码在手&#xff1a;程序员的金三银四求职指南》 随着春风的轻拂&#xff0c;大地复苏&#xff0c;万物更新。在这个生机勃勃的季节&#xff0c;不仅自然界在迎接新生&#xff0c;对于广大的程序员朋友们而言&#xff0c;这也是一个全新的开始——金三…

关于HTML标签应用教程

简介 HTML&#xff08;HyperText Markup Language&#xff09;是用于创建网页结构的标记语言。在本教程中&#xff0c;我们将介绍一些常用的HTML标签&#xff0c;以及它们的用法和示例。 1. HTML基础结构 <!DOCTYPE html> <html> <head><title>页面…

windows U盘不能识别

windows U盘不能识别 1、问题描述2、问题分析解决3、把U盘插到windows电脑上试试能不能识别 1、问题描述 windwos u盘不能识别 u盘被拿到mac电脑上做了启动盘之后&#xff0c;就不能被windows识别了。题主很奇怪里面被mac电脑的同学放了什么&#xff0c;因此想到把优盘挂载到L…

免费的Git图形界面工具sourceTree介绍

阅读本文同时请参阅-----代码库管理工具Git介绍 sourceTree是一款免费的Git图形界面工具&#xff0c;它简化了Git的使用过程&#xff0c;使得开发者可以更加方便地下载代码、更新代码、提交代码和处理冲突。下面我将详细介绍如何使用sourceTree进行这些操作。 1.下载和…

代码随想录day23:回溯part3,继续组合问题

文章目录 day23&#xff1a;回溯part3&#xff0c;继续组合问题39.组合总和40.组合总和 II131.分割回文串 day23&#xff1a;回溯part3&#xff0c;继续组合问题 39.组合总和 class Solution {List<List<Integer>> ans new ArrayList<>();List<Integer…