vue3 组件内判断是从哪个页面过来的

setup中只有onBeforeRouteLeave、onBeforeRouteUpdate两个钩子函数,没有beforeRouteEnter对应的钩子函数,所以无法在setup中直接使用

<script setup>
import { onBeforeRouteLeave, onBeforeRouteUpdate } from 'vue-router';onBeforeRouteLeave((to,from)=>{console.log(to,from)
})onBeforeRouteUpdate((to,from)=>{console.log(to,from)
})
</script>

解决方案

Tips:使用选项式api,就可以使用beforeRouterEnter这个钩子,同时需要调用页面函数,

  • 使用 <script setup> 的组件是默认关闭的,组件实例使用不到顶层的数据和函数。
  • 需要配合 defineExpose 暴露给组件实例使用,暴露的响应式数据会自动解除响应式。
<script>
import { defineComponent } from 'vue'
export default defineComponent({beforeRouteEnter(to, from, next) {if (from.path == '/nav') {// sessionStorage.setItem('sign', true)next(vm => {vm.getUseorderlist ();})} else if (from.path.includes('/records-details')) {// sessionStorage.setItem('sign', false)next()}next()},
})
</script><script setup>
const getUseorderlist = async () => {console.log('getUseorderlist ')
}
defineExpose({ getUseorderlist })
</script>

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

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

相关文章

Java中String、StringBuffer和StringBuilder的区别

在Java中&#xff0c;String、StringBuffer和StringBuilder是用于处理字符串的类&#xff0c;它们之间有以下区别&#xff1a; String&#xff1a; String是不可变的&#xff0c;一旦创建就不能被修改。每次对String进行修改时&#xff0c;实际上都是创建了一个新的String对象…

【leetcode 2707. 字符串中的额外字符】动态规划 字典树

2707. 字符串中的额外字符 题目描述 给你一个下标从 0 开始的字符串 s 和一个单词字典 dictionary 。你需要将 s 分割成若干个 互不重叠 的子字符串&#xff0c;每个子字符串都在 dictionary 中出现过。s 中可能会有一些 额外的字符 不在任何子字符串中。 请你采取最优策略分割…

Go 如何处理死锁以提供哪些工具来检测或防死锁?

并发是 Go 的核心特性&#xff0c;它使程序能够同时处理多个任务。它是现代编程的一个强大组件&#xff0c;如果使用正确&#xff0c;可以产生高效、高性能的应用程序。然而&#xff0c;并发性也带来了顺序编程中不存在的某些类型错误的可能性&#xff0c;其中最臭名昭著的是死…

拼多多API的未来:无限可能性和创新空间

拼多多&#xff0c;作为中国电商市场的巨头之一&#xff0c;自成立以来一直保持着高速的发展态势。其API的开放为开发者提供了无限的可能性和创新空间&#xff0c;使得更多的商业逻辑和功能得以实现。本文将深入探讨拼多多API的未来发展&#xff0c;以及它所具备的无限可能性和…

面相圆润是有福气的象征

在中国传统文化中&#xff0c;面相是一个非常重要的概念。相信大家肯定听说过“相由心生”这个成语吧&#xff0c;这就是告诉我们&#xff0c;一个人的面貌其实是可以反映出他内心的状态和气质&#xff0c;也可以反映其性格、健康状况和运势等。而一个圆润的面相&#xff0c;则…

vue布局居中

要在Vue项目中实现居中布局&#xff0c;您可以使用以下方法&#xff1a; 方法一&#xff1a;使用flexbox布局 在父元素的样式中&#xff0c;添加display: flex;和justify-content: center;属性。 <template><div class"parent"><div class"chi…

编程笔记 html5cssjs 034 HTML MathML

编程笔记 html5&css&js 034 HTML MathML 一、HTML5 MathML二、看实例小结 网页上什么都可以出现呀&#xff0c;数学公式是不是也需要显示出来呀&#xff1f;这东西就叫MathML。 一、HTML5 MathML HTML5 可以在文档中使用 MathML 元素&#xff0c;对应的标签是 <mat…

自定义 bert 在 onnxruntime 推理错误:TypeError: run(): incompatible function arguments

自定义 bert 在 onnxruntime 推理错误&#xff1a;TypeError: run&#xff08;&#xff09;: incompatible function arguments 自定义 bert 在 onnxruntime 推理错误&#xff1a;TypeError: run(): incompatible function arguments推理代码错误提示核心错误 解决方法核对参数…

Spring面试整理-Spring的依赖注入

Spring框架的依赖注入(DI)是其核心功能之一,它允许对象定义它们依赖的其他对象,而不是自己创建或查找它们。这种机制促进了松耦合和更容易的测试。 依赖注入(DI) 依赖注入是一种设计模式,其中一个对象或方法提供另一个对象的依赖关系。在Spring中,这些依赖通常是服务、…

游泳耳机排行榜前四名,分享几款值得推荐的游泳耳机

游泳是一项全面锻炼身体的运动&#xff0c;然而&#xff0c;水的阻力有时让人感到运动的笨拙和单调。为了让游泳更具趣味性和挑战性&#xff0c;选择一款高品质的游泳耳机至关重要。以下是游泳耳机排行榜前四名&#xff0c;以及几款强烈推荐的游泳耳机&#xff0c;它们结合防水…

火狐谷歌兼容性问题整理

火狐谷歌兼容性问题整理 整理近期项目中遇到的火狐浏览器和谷歌浏览器兼容性问题。 数字输入框实现功能&#xff1a;限制输入框可输入内容类型为Number类型&#xff0c;其他类型不可输入。 &#xff08;1&#xff09;错误实现方法&#xff1a; 此方式在谷歌浏览器中可以实现&…

jsonpath提取字段某个字段为指定值的其他字段数据提取某个字段的所有值

1.jsonpath提取某个字段为指定值的其他字段数据 [ [ { “code”: “a255e81dc5a5442e”, “name”: “原始货号”, “values”: [ { “code”: “223e768a1b18b64c”, “attrCode”: “a255e81dc5a5442e”, “displayName”: “P11”, “frontName”: “P11”, “images”: [],…

【QT-UI】

1.使用手动连接&#xff0c;将登录框中的取消按钮使用qt4版本的连接到自定义的槽函数中&#xff0c;在自定义的槽函数中调用关闭函数 #include "mainwindow.h" #include "ui_mainwindow.h"MainWindow::MainWindow(QWidget *parent): QMainWindow(parent), …

Python中级知识梳理

1. 文件操作 Python中的文件操作通常使用内置的open()函数来打开文件。以下是一个简单的示例&#xff1a; with open("file.txt", "r") as f:content f.read()print(content)在这个示例中&#xff0c;我们打开了名为"file.txt"的文件&#xf…

mac 快捷键

mac 程序坞 ctrlaltD:打开程序坞 调度中心 Ctrl键↑: 调度中心 Ctrl键↓:应用程序窗口 F11 : 显示桌面 输入法 Ctrl键空格: 切换输入法 Ctrl键Alt(Option)空格: 切换输入法 截屏 帮助 Ctrl键shift键/: 显示帮助

使用 CSS : 伪元素:after、过渡动画transition实现过渡效果(鼠标悬浮或点击 标签时,底部边框从左到右过渡)

首先&#xff0c;给 <span> 标签添加一个父元素&#xff0c;定义属性类名&#xff1a;nav-wrapper &#xff0c;父级设置相对定位。然后&#xff0c;使用 ::after 伪元素来创建一个与底部边框相同宽度的元素&#xff0c;初始时宽度为 0&#xff0c;通过过渡动画transitio…

.net maui 启动调试windows程序退出

vs2022 .net 8 启动调试windows程序时闪退&#xff0c;错误代码 2147942405 解决方案&#xff1a;在csproj文件里面的PropertyGroup节点下面添加<WindowsAppSdkDeploymentManagerInitialize>false</WindowsAppSdkDeploymentManagerInitialize>

「服务器」4.新手小白如何安装服务器环境-宝塔

刚开始初始化好的服务器&#xff0c;使用了阿里云客户端&#xff0c;看着网络脚本乱装&#xff0c;后来决定宝塔环境发现有重复的环境&#xff0c;遂决定重新初始化一下&#xff0c;然后重头干起。 重置服务器 将服务器关闭运行状态后&#xff0c;点击重新初始化云盘即可重新初…

GCF:在线市场异质治疗效果估计的广义因果森林

英文题目&#xff1a;GCF: Generalized Causal Forest for Heterogeneous Treatment Effects Estimation in Online Marketplace 中文题目&#xff1a;GCF&#xff1a;在线市场异质治疗效果估计的广义因果森林 单位&#xff1a;滴滴&美团 时间&#xff1a;2022 论文链接…

【数据库原理】期末突击(2)

有不会的题可以后台问我的哦&#xff0c;看见了就会回。祝大家期末心想事成。 数据库大题显而易见就只有几类&#xff0c;大家可以根据老师平时讲解的例题对应去解决一类型的题目。 前提知识; 候选码候选键关键字键码 关系代数&#xff1a;&#xff08;1&#xff09;传统&…