当前位置: 首页 > news >正文

Vue2移动端项目使用$router.go(-1)不生效问题记录

目录

1、this.$router.go(-1) 改成 this.$router.back()

2、存储 from.path,使用 this.$router.push

3、hash模式中使用h5新增的onhashchange事件做hack处理

4、this.$router.go(-1) 之前添加一个 replace 方法


问题背景 :

在 Vue2 的一个移动端开发项目中,拆封了一个公共头部组件 components 下的 Header ,

里面使用了 Vant2 组件库 的 <van-nav-bar> 组件,组件有个点击左侧 “ 返回 ” 按钮的方法,

会调用 @click-left="onClickLeft" , onClickLeft 方法里使用了 this.$router.go(-1) ,

返回上一级路由页面的 Vue2 语法,结果没有返回上一级页面,而且路由地址眼看着改变了,

但是页面展示还是停留在当前页面,需要手动刷新才能渲染跳转后的页面。

解决起来一头雾水,所以只好百度咯 ~ 这里只是给自己留一个记录方便看 :


1、this.$router.go(-1) 改成 this.$router.back()

this.$router.go(-1) 失效 ( 路由改变了,界面未刷新)


2、存储 from.path,使用 this.$router.push


3、hash模式中使用h5新增的onhashchange事件做hack处理

// 检测浏览器路由改变页面不刷新问题,hash模式的工作原理是hashchange事件
window.addEventListener('hashchange', () => {let currentPath = window.location.hash.slice(1)if (this.$route.path !== currentPath) {this.$router.push(currentPath)}
}, false)

4、this.$router.go(-1) 之前添加一个 replace 方法


以上就是我百度到的各种解决办法啦 ,小伙伴们可自行测试选取哦~

这里我就直接使用了第1种方法,改成了  this.$router.back() ,看着好像也 OK 。

相关文章:

Vue2移动端项目使用$router.go(-1)不生效问题记录

目录 1、this.$router.go(-1) 改成 this.$router.back() 2、存储 from.path&#xff0c;使用 this.$router.push 3、hash模式中使用h5新增的onhashchange事件做hack处理 4、this.$router.go(-1) 之前添加一个 replace 方法 问题背景 &#xff1a; 在 Vue2 的一个移动端开发…...

ChatGPT与文心一言:AI助手之巅的对决

随着科技的飞速发展&#xff0c;人工智能助手已经渗透到我们的日常生活和工作中。 而在这个充满竞争的领域里&#xff0c;ChatGPT和文心一言无疑是最引人注目的两款产品。它们各自拥有独特的优势&#xff0c;但在智能回复、语言准确性、知识库丰富度等方面却存在差异。那么&am…...

前端实现贪吃蛇功能

大家都玩过贪吃蛇小游戏&#xff0c;控制一条蛇去吃食物&#xff0c;然后蛇在吃到食物后会变大。本篇博客将会实现贪吃蛇小游戏的功能。 1.实现效果 2.整体布局 /*** 游戏区域样式*/ const gameBoardStyle {gridTemplateColumns: repeat(${width}, 1fr),gridTemplateRows: re…...

文件操作(上)

目录 文件的必要性&#xff1a; 文件分类&#xff1a; 程序文件&#xff1a; 数据文件&#xff1a; 文件的打开与关闭&#xff1a; fopen函数分析: ​编辑 FILE*: char*filename: char*mode: fclose函数&#xff1a; 应用&#xff1a; 文件编译 Fgetc Fputc 应用…...

用CHAT写年终总结

问CHAT&#xff1a;写一份政企经理年度总结 CHAT回复&#xff1a;尊敬的同事和领导&#xff1a; 大家好&#xff0c;我是负责政企业务的经理&#xff0c;全年一直坚守在销售一线&#xff0c;为公司带来更多的企业客户并拓展业务领域。感谢领导和同事在工作中的大力支持与热情协…...

day01 深度学习介绍

目录 1.1深度学习介绍 1.2神经网络NN 1、概念&#xff1a; 2、神经元 3、&#xff08;单层&#xff09;神经网络 4、感知机&#xff08;两层&#xff09; 5、多层神经网络 6、激活函数 &#xff08;1&#xff09;饱和与非饱和激活函数 &#xff08;2&#xff09;饱和激活…...

k8s 部署 Nginx 并代理到tomcat

一、已有信息 [rootmaster nginx]# kubectl get nodes -o wide [rootmaster nginx]# kubectl get svc NAME TYPE CLUSTER-IP EXTERNAL-IP PORT(S) AGE kubernetes ClusterIP 10.96.0.1 <none> 443/TCP 2…...

医学图像的数据增强技术 --- 切割-拼接数据增强(CS-DA)

医学图像的新型数据增强技术 CS-DA 核心思想自然图像和医学图像之间的关键差异CS-DA 步骤确定增强后的数据数量 代码复现 CS-DA 核心思想 论文链接&#xff1a;https://arxiv.org/ftp/arxiv/papers/2210/2210.09099.pdf 大多数用于医学分割的数据增强技术最初是在自然图像上开…...

git克隆/拉取报错过早的文件结束符(EOF)的原因及解决

近期使用git拉取仓库的时候&#xff0c;拉取了好几次都不行&#xff0c;总是反馈说过早的文件结束符 总是这样&#xff0c;当然我的报错信息并没有描述完整&#xff0c;因为在我检索此类问题的时候&#xff0c;我发现有好多种所谓的过早的文件结束符这样的报错&#xff0c;但是…...

【ARM 嵌入式 编译系列 2.5 -- GCC 编译参数学习 --specs=nano.specs选项 】

请阅读【嵌入式开发学习必备专栏 之 ARM GCC 编译专栏】 文章目录 概述nano.specs示例使用注意事项问题总结概述 ARM 工具链 (arm-none-eabi-) 包括了一个叫作 --specs 的编译器和链接器选项,这个选项允许用户指定一个或多个 “specs” 文件,以影响编译或链接阶段的行为。Sp…...

C语言大师(5)构造函数和析构函数

引言 在C的面向对象编程中&#xff0c;构造函数和析构函数扮演着至关重要的角色。它们分别管理对象的初始化和销毁过程&#xff0c;确保资源的有效分配和释放。了解这些函数如何工作&#xff0c;对于编写高效和可靠的C程序至关重要。 1. 构造函数 构造函数在每次创建类的新对…...

安全审查常见要求

一、是否有密码复杂度策略、是否有密码有效期 1&#xff09;密码长度至少8位&#xff1b; 2&#xff09;要求用户密码必须包含大小写字母、数字、特殊字符 3&#xff09;避免常见密码 123456&#xff0c;qwerty, password; 4) 强制用户定期修改密码&#xff1b; 5&#x…...

最新 生成pdf文字和表格

生成pdf文字和表格 先看效果 介绍 java项目&#xff0c;使用apache的pdfbox工具&#xff0c;可分页&#xff0c;自定义列 依赖 <dependency><groupId>org.apache.pdfbox</groupId><artifactId>pdfbox</artifactId><version>2.0.22<…...

安全基础~攻防特性3

文章目录 SSTI(模板注入)1. 简介2. 成因3. 常见框架存在注入4. 判断存在SSTI SSTI(模板注入) 1. 简介 (Server-Side Template Injection) 服务端模板注入 1、使用框架&#xff08;MVC的模式&#xff09;&#xff0c;如python的flask&#xff0c;php的tp&#xff0c;java的sp…...

Windows7关闭谷歌浏览器提示“若要接收后续 Google Chrome 更新,您需使用 Windows 10 或更高版本”的方法

背景 电脑比较老&#xff0c;系统一直没有更新&#xff0c;硬件和软件版本如下&#xff1a; 操作系统版本&#xff1a;Windows7 企业版 谷歌浏览器版本&#xff1a;109.0.5414.120&#xff08;正式版本&#xff09; &#xff08;64 位&#xff09; 该版本的谷歌浏览器是支持…...

[一]ffmpeg音视频解码

[一]ffmpeg音视频解码 一.编译ffmpeg1.安装vmware虚拟机2.vmware虚拟机安装linux操作系统3.安装ftp和fshell软件4.在Ubuntu&#xff08;Linux&#xff09;中编译Android平台的FFmpeg&#xff08; arm和x86 &#xff09;5.解压FFmpeg6.Android编译脚本&#xff08;1&#xff09;…...

k8s-认证授权 14

Kubernetes的认证授权分为认证&#xff08;鉴定用户身份&#xff09;、授权&#xff08;操作权限许可鉴别&#xff09;、准入控制&#xff08;资源对象操作时实现更精细的许可检查&#xff09;三个阶段。 Authentication&#xff08;认证&#xff09; 认证方式现共有8种&…...

在全志H616核桃派上实现USB摄像头的OpenCV颜色检测

在给核桃派开发板用OpenCV读取图像并显示到pyqt5的窗口上并加入颜色检测功能&#xff0c;尝试将图像中所有蓝色的东西都用一个框标记出来。 颜色检测核心api 按照惯例&#xff0c;先要介绍一下opencv中常用的hsv像素格式。颜色还是那个颜色&#xff0c;只是描述颜色用的参数变…...

mac安装部署gitbook教程

mac安装部署gitbook教程 前言一、安装准备二、GitBook安装三、项目初始化 前言 一些自己实际操作的记录。 一、安装准备 Node.js gitbook基于Node.js&#xff0c;所以需要提前安装。 下载地址&#xff1a;https://nodejs.org/en/&#xff0c;可以下载比较新的版本。(但我的建议…...

有关软件测试的,任何时间都可以,软件测试主要服务项目:测试用例 报告 计划

有关软件测试的&#xff0c;任何时间都可以&#xff0c;软件测试主要服务项目&#xff1a; 1. 测试用例 2. 测试报告 3. 测试计划 4. 白盒测试 5. 黑盒测试 6. 接口测试 7.自动…...

web vue 项目 Docker化部署

Web 项目 Docker 化部署详细教程 目录 Web 项目 Docker 化部署概述Dockerfile 详解 构建阶段生产阶段 构建和运行 Docker 镜像 1. Web 项目 Docker 化部署概述 Docker 化部署的主要步骤分为以下几个阶段&#xff1a; 构建阶段&#xff08;Build Stage&#xff09;&#xff1a…...

19c补丁后oracle属主变化,导致不能识别磁盘组

补丁后服务器重启&#xff0c;数据库再次无法启动 ORA01017: invalid username/password; logon denied Oracle 19c 在打上 19.23 或以上补丁版本后&#xff0c;存在与用户组权限相关的问题。具体表现为&#xff0c;Oracle 实例的运行用户&#xff08;oracle&#xff09;和集…...

Java 语言特性(面试系列2)

一、SQL 基础 1. 复杂查询 &#xff08;1&#xff09;连接查询&#xff08;JOIN&#xff09; 内连接&#xff08;INNER JOIN&#xff09;&#xff1a;返回两表匹配的记录。 SELECT e.name, d.dept_name FROM employees e INNER JOIN departments d ON e.dept_id d.dept_id; 左…...

Golang dig框架与GraphQL的完美结合

将 Go 的 Dig 依赖注入框架与 GraphQL 结合使用&#xff0c;可以显著提升应用程序的可维护性、可测试性以及灵活性。 Dig 是一个强大的依赖注入容器&#xff0c;能够帮助开发者更好地管理复杂的依赖关系&#xff0c;而 GraphQL 则是一种用于 API 的查询语言&#xff0c;能够提…...

oracle与MySQL数据库之间数据同步的技术要点

Oracle与MySQL数据库之间的数据同步是一个涉及多个技术要点的复杂任务。由于Oracle和MySQL的架构差异&#xff0c;它们的数据同步要求既要保持数据的准确性和一致性&#xff0c;又要处理好性能问题。以下是一些主要的技术要点&#xff1a; 数据结构差异 数据类型差异&#xff…...

python如何将word的doc另存为docx

将 DOCX 文件另存为 DOCX 格式&#xff08;Python 实现&#xff09; 在 Python 中&#xff0c;你可以使用 python-docx 库来操作 Word 文档。不过需要注意的是&#xff0c;.doc 是旧的 Word 格式&#xff0c;而 .docx 是新的基于 XML 的格式。python-docx 只能处理 .docx 格式…...

C# 求圆面积的程序(Program to find area of a circle)

给定半径r&#xff0c;求圆的面积。圆的面积应精确到小数点后5位。 例子&#xff1a; 输入&#xff1a;r 5 输出&#xff1a;78.53982 解释&#xff1a;由于面积 PI * r * r 3.14159265358979323846 * 5 * 5 78.53982&#xff0c;因为我们只保留小数点后 5 位数字。 输…...

【数据分析】R版IntelliGenes用于生物标志物发现的可解释机器学习

禁止商业或二改转载&#xff0c;仅供自学使用&#xff0c;侵权必究&#xff0c;如需截取部分内容请后台联系作者! 文章目录 介绍流程步骤1. 输入数据2. 特征选择3. 模型训练4. I-Genes 评分计算5. 输出结果 IntelliGenesR 安装包1. 特征选择2. 模型训练和评估3. I-Genes 评分计…...

在web-view 加载的本地及远程HTML中调用uniapp的API及网页和vue页面是如何通讯的?

uni-app 中 Web-view 与 Vue 页面的通讯机制详解 一、Web-view 简介 Web-view 是 uni-app 提供的一个重要组件&#xff0c;用于在原生应用中加载 HTML 页面&#xff1a; 支持加载本地 HTML 文件支持加载远程 HTML 页面实现 Web 与原生的双向通讯可用于嵌入第三方网页或 H5 应…...

python爬虫——气象数据爬取

一、导入库与全局配置 python 运行 import json import datetime import time import requests from sqlalchemy import create_engine import csv import pandas as pd作用&#xff1a; 引入数据解析、网络请求、时间处理、数据库操作等所需库。requests&#xff1a;发送 …...