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

vue2.7支持组合式API,但是对应的vue-router3并不支持useRoute、useRouter。

最近在做一个项目,因为目标用户浏览器版本并不确定,可能会有较旧版本,于是采用vue2.7而不是vue3,最近一年多使用vue3开发的项目都碰到了很多chrome 63-73版本,而对应UI 库 element plus又问题很多。

为了不碰到这些问题,还是旧版的vue2兼容更好,element ui用起来也更舒服。

但是在用vue2时候 不可能再选型2.6.x的版本,因为选项API已经淘汰了,如果不使用vue2.7支持的组合式API,那么个人对vue的技术掌握就得不到提升。

但是在使用vue2.7.16的时候就有一个问题,vue-router3.6.5不支持useRoute、useRouter 钩子函数,这时就自己封装,如下。

/*** 升级vue2.7辅助函数*/
import { getCurrentInstance } from 'vue'
/** this.$store替换方案 */
export function useStore() {const { proxy } = getCurrentInstance()const store = proxy.$storereturn store
}
/** this.$route替换方案 */
export function useRoute() {const { proxy } = getCurrentInstance()const route = proxy.$routereturn route
}
/** this.$router替换方案 */
export function useRouter() {const { proxy } = getCurrentInstance()const router = proxy.$routerreturn router
}

这样封装后有一个问题就是watch无法监听到 useRoute的结果。

希望以后vue-router3能加上useRoute、useRouter 钩子函数

相关文章:

vue2.7支持组合式API,但是对应的vue-router3并不支持useRoute、useRouter。

最近在做一个项目,因为目标用户浏览器版本并不确定,可能会有较旧版本,于是采用vue2.7而不是vue3,最近一年多使用vue3开发的项目都碰到了很多chrome 63-73版本,而对应UI 库 element plus又问题很多。 为了不碰到这些问…...

摊位纠纷演变肢体冲突,倒赔了500:残疾夫妇与摊主谁之过?

在一个小商贩密集的街区,一起由摊位纠纷引发的肢体冲突事件在当地社区和网络上引起了热议。涉事双方为一名摊主和一对残疾夫妇,他们的争执源自对一个摊位的使用权。本是口头上的争吵,却由于双方情绪激动,迅速升级为肢体冲突&#…...

深入理解和实现Windows进程间通信(消息队列)

常见的进程间通信方法 常见的进程间通信方法有: 管道(Pipe)消息队列共享内存信号量套接字 下面,我们将详细介绍消息队列的原理以及具体实现。 什么是消息队列? Windows操作系统使用消息机制来促进应用程序与操作系…...

Web网页前端教程免费:引领您踏入编程的奇幻世界

Web网页前端教程免费:引领您踏入编程的奇幻世界 在当今数字化时代,Web前端技术已成为互联网发展的重要驱动力。想要踏入这一领域,掌握相关技能,却苦于找不到合适的教程?别担心,本文将为您带来一份免费的We…...

北斗短报文终端在应急消防通信场景中的应用

在应对自然灾害和紧急情况时,北斗三号短报文终端以其全球覆盖、实时通信和精准定位的能力,成为应急消防通信的得力助手。它不仅能够在地面通信中断的极端条件下保障信息传递的畅通,还能提供精准的位置信息,为救援行动提供有力支持…...

Java跳动爱心代码

1.计算爱心曲线上的点的公式 计算爱心曲线上的点的公式通常基于参数方程。以下是两种常见的参数方程表示方法,用于绘制爱心曲线: 1.1基于 (x, y) 坐标的参数方程 x a * (2 * cos(θ) - sin(θ))^3 y a * (2 * sin(θ) - cos(θ))^3 其中&#xff…...

Swift Combine — Operators(常用Filtering类操作符介绍)

目录 filter(_: )tryFilter(_: )compactMap(_: )tryCompactMap(_: )removeDuplicates()first(where:)last(where:) Combine中对 Publisher的值进行操作的方法称为 Operator(操作符)。 Combine中的 Operator通常会生成一个 Publisher,该 …...

Windows11+CUDA12.0+RTX4090如何配置安装Tensorflow2-GPU环境?

1 引言 电脑配置 Windows 11 cuda 12.0 RTX4090 由于tensorflow2官网已经不支持cuda11以上的版本了,配置cuda和tensorflow可以通过以下步骤配置实现。 2 步骤 (1)创建conda环境并安装cuda和cudnn,以及安装tensorflow2.10 con…...

韩顺平0基础学Java——第27天

p548-568 明天开始坦克大战 Entry 昨天没搞明白的Map、Entry、EntrySet://GPT教的 Map 和 Entry 的关系 1.Map 接口:它定义了一些方法来操作键值对集合。常用的实现类有 HashMap、TreeMap 等。 2. Entry接口:Entry 是 Map 接口的一个嵌…...

YesPMP探索Python在生活中的应用,助力提升开发效率

Python是一种简单易学、高效强大的编程语言,正变成越来越多人选择的热门技能。学习Python不仅可以提供更多就业机会,还能让自己在职场更加有竞争力,那可以去哪里拓展自己的技能呢? YesPMP平台 为熟练掌握Python语言的程序员提供了…...

TikTok账号运营:静态住宅IP为什么可以防封?

静态住宅IP代理服务是一种提供稳定、静态IP地址并可隐藏用户真实IP地址的网络代理服务。此类代理服务通常使用高速光纤网络来提供稳定、高速的互联网体验。与动态IP代理相比,静态住宅IP代理的IP地址更稳定,被封的可能性更小,因此更受用户欢迎…...

linux系统宝塔服务器temp文件夹里总是被上传病毒php脚本

目录 简介 上传过程 修复上传漏洞 tmp文件夹总是被上传病毒文件如下图: 简介 服务器时不时的会发送短信说你服务器有病毒, 找到了这个tmp文件, 删除了之后又有了。 确实是有很多人就这么无聊, 每天都攻击你的服务器。 找了很久的原因, 网上也提供了一大堆方法,…...

HTML+CSS+PHP实现网页留言板功能(需要创建数据库)

话说前头&#xff0c;我这方面很菜滴。这是我网页作业的一部分。 1.body部分效果展示&#xff08;不包括footer&#xff09; 2、代码 2.1 leaving.php&#xff08;看到的网页&#xff09; <!DOCTYPE html> <html lang"en"> <head> <met…...

【谷歌】实用的搜索技巧

1、使用正确的谷歌网址 我们知道https://www.google.com是谷歌的网址。但根据国家,用户可能会被重定向到 google.fr(法国)或google.co.in(印度)。 最主要的URL——google.com是为美国用户准备的(或是针对全世界所有用户的唯一URL))。当你在谷歌上搜索时,了解这一点是相…...

打造完美启动页:关键策略与设计技巧

启动页&#xff08;Splash Screen&#xff09;设计是指在应用程序启动时&#xff0c;首先展示给用户的界面设计。这个界面通常在应用加载或初始化期间显示&#xff0c;其主要目的是为用户提供一个视觉缓冲&#xff0c;展示品牌标识&#xff0c;并减少用户在等待过程中的焦虑感。…...

电子书(chm)-加载JS--CS上线

免责声明: 本文仅做技术交流与学习... 目录 cs--web投递 html(js)代码 html生成chm工具--EasyCHM 1-选择powershell 模式 生成 2-选择bitsadmin模式生成 chm反编译成html cs--web投递 cs配置监听器--->攻击---->web投递---> 端口选择没占用的, URL路径到时候会在…...

理解HTTP请求格式

HTTP概念 HTTP全称HyperTextTransfer Protocol(超文本传输协议)是一种用于分布式、协作式和超媒体信息系统的应用层协议&#xff1b;HTTP是一个客户端&#xff08;用户&#xff09;和服务端&#xff08;网站&#xff09;之间请求和响应的标准。 HTTP 协议是以 ASCII 码传输&…...

差分数组汇总

本文涉及知识点 算法与数据结构汇总 差分数组 令 a[i] ∑ j : 0 i v D i f f [ i ] \sum_{j:0}^{i}vDiff[i] ∑j:0i​vDiff[i] 如果 vDiff[i1]&#xff0c;则a[i1…]全部 如果vDiff[i2]–,则a[i2…]全部–。 令11 < i2 &#xff0c;则&#xff1a; { a [ i ] 不变&…...

SpringBoot | 实现邮件发送

运行环境&#xff1a; IntelliJ IDEA 2022.2.5 (Ultimate Edition) (注意&#xff1a;idea必须在2021版本以上&#xff09;JDK17 项目目录&#xff1a; 该项目分为pojo,service,controller,utils四个部分&#xff0c; 在pojo层里面写实体内容&#xff08;发邮件需要的发件人邮…...

spring boot接入nacos 配置中心

再接入nacos配置中心时&#xff0c;需要确认几点&#xff1a; 1. spring boot 版本 (spring boot 2.x ) 2. nacos 配置中心 服务端 版本 (1.1.4) 3. nacos client 客户端版本 (1.1.4) 方式一 1. 启动 nacos 服务端&#xff0c;这里不做解释 在配置中心中加入几个配置 2. 在…...

手把手教你用FPGA+CORDIC算法实现任意角度图像旋转(告别浮点运算)

FPGACORDIC算法实现高精度图像旋转的硬件优化实践 在数字图像处理领域&#xff0c;实时图像旋转是一项基础而关键的技术需求。传统基于浮点运算的旋转方案虽然直观&#xff0c;但在FPGA等硬件平台上往往面临资源占用高、时序难以满足的挑战。本文将深入探讨如何利用CORDIC&…...

OBS Source Record插件深度解析:5个实战技巧实现多源独立录制

OBS Source Record插件深度解析&#xff1a;5个实战技巧实现多源独立录制 【免费下载链接】obs-source-record 项目地址: https://gitcode.com/gh_mirrors/ob/obs-source-record 你是否曾经在直播或视频制作中&#xff0c;想要单独录制某个摄像头画面、游戏窗口或浏览器…...

AutoResearchClaw:基于LLM的自动化研究管线,从想法到论文的工程化实践

1. 项目概述&#xff1a;从“聊个想法”到“生成论文”的自动化研究革命如果你是一名科研工作者、研究生&#xff0c;或者任何需要产出高质量学术内容的人&#xff0c;你肯定经历过这样的痛苦&#xff1a;一个绝妙的研究想法在脑海中诞生&#xff0c;但随之而来的是海量的文献调…...

LeetCode 1665.完成所有任务的最少初始能量:排序(贪心)

【LetMeFly】1665.完成所有任务的最少初始能量&#xff1a;排序(贪心) 力扣题目链接&#xff1a;https://leetcode.cn/problems/minimum-initial-energy-to-finish-tasks/ 给你一个任务数组 tasks &#xff0c;其中 tasks[i] [actuali, minimumi] &#xff1a; actuali 是完…...

Deep Lake:面向AI的统一数据湖仓,重塑深度学习数据管理

1. 从数据湖到AI数据库&#xff1a;为什么我们需要Deep Lake&#xff1f;如果你在搞AI项目&#xff0c;尤其是涉及大语言模型&#xff08;LLM&#xff09;或者计算机视觉&#xff0c;数据管理这块儿大概率让你头疼过。我自己的经验是&#xff0c;项目初期&#xff0c;数据量小&…...

有机颜料哪个更前沿

下游行业不断升级&#xff0c;从环保要求到个性化着色需求都在提升&#xff0c;很多采购和技术负责人都会问&#xff1a;现在有机颜料哪个方向更前沿&#xff1f;其实有机颜料的技术迭代始终围绕下游需求走&#xff0c;没有绝对的“最优前沿”&#xff0c;只有更适配自身需求的…...

软考高项备考重点考点18:项目绩效域

一、历年真题分布 2023年5月 选择题3分 2023年11月 选择题3分 案例5分第1批,15分第3批,5分第4批 论文 75分 第2批 2024年5月 选择题3分 案例10分 第2批 2025年5月 选择题2分 论文 75分 第1批、第2批 二、备考重点…...

从机械奇观到数字逻辑:FPGA设计中的状态机与系统思维

1. 项目概述&#xff1a;当鲁布戈德堡机械遇见数字逻辑的灵魂我的一位老朋友杰伊道林最近给我分享了两段视频&#xff0c;看完之后&#xff0c;我的第一反应是“袜子都要被震飞了”——这让我认真考虑&#xff0c;是不是该换双带松紧带的袜子。这两段视频&#xff0c;一段是森林…...

032随机链表的复制

随机链表的复制 题目链接&#xff1a;https://leetcode.cn/problems/copy-list-with-random-pointer/description/?envTypestudy-plan-v2&envIdtop-100-liked 我的解答&#xff1a; public Node copyRandomList(Node head) {Node dummy new Node(-1);Node curhead, newCu…...

金融文档实时检索难?电商SKU模糊匹配慢?DeepSeek垂直搜索3类高价值场景落地,附可复用Prompt工程模板

更多请点击&#xff1a; https://intelliparadigm.com 第一章&#xff1a;金融文档实时检索难&#xff1f;电商SKU模糊匹配慢&#xff1f;DeepSeek垂直搜索3类高价值场景落地&#xff0c;附可复用Prompt工程模板 三大典型业务痛点与DeepSeek-R1适配逻辑 传统向量检索在专业领…...