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

router-link 和 router-view的区别

router-link 实现路由之间的跳转

router-view(路由出口组件 -> 渲染路径匹配到的视图组件

当你访问的地址与路由path相符时,会将指定的组件替换该router-view

router-link

router-link 点击实现路由跳转to属性指向目标地址,默认渲染成带有正确连接的<a>的标签。<router-link>相当于<a href='...'>,但比起更好。

 注:router-link组件 默认支持激活样式显示,即 active-class=’类名‘。如上述的第二个routerlink,其中, 使用反引号(`)模板字符串 来拼接参数,用法 `/路径/${参数}`

router-view

每一级路由都有路由出口,路由出口置于上一级组件/父组件中。

如,在根组件App.vue中写一级路由出口,在一级路由中写下一级的路由出口

注:vue是热更新,不需要刷新页面即可使用。

参考:vue 路由的内置组件 router-view 详细介绍(有图有真相)_vue 组件中的 router-view 指向哪里_web前端 zxp的博客-CSDN博客

API 参考 | Vue Router (vuejs.org)

router-link:to+动态指向_router-link to_okherry的博客-CSDN博客

相关文章:

router-link 和 router-view的区别

router-link 实现路由之间的跳转 router-view&#xff08;路由出口组件 -> 渲染路径匹配到的视图组件&#xff09; 当你访问的地址与路由path相符时&#xff0c;会将指定的组件替换该router-view router-link router-link 点击实现路由跳转&#xff0c;to属性指向目标地址&…...

【Leetcode】139.单词拆分

一、题目 1、题目描述 给你一个字符串 s 和一个字符串列表 wordDict 作为字典。请你判断是否可以利用字典中出现的单词拼接出 s 。 注意:不要求字典中出现的单词全部都使用,并且字典中的单词可以重复使用。 示例1: 输入: s = “leetcode”, wordDict = [“leet”, “cod…...

PMP考试一定要报培训班吗?

随着近年来PMP证书在国内日渐吃香&#xff0c;越来越多人开始报考PMP考试&#xff0c;甚至不少企业还会通过各项奖励政策来鼓励内部项目骨干去考取PMP证书。 免费送备考资料。 很多初次参加PMP考试的人会有这种疑惑&#xff0c;那就是考PMP证书必须要参加培训班吗? 在我看来&…...

dart 学习 之 Getters and setters

前言 任何需要对属性进行更多控制而不是允许简单字段访问的时候&#xff0c;你都可以自定义 getter 和 setter。 正文 讲解 Getter&#xff08;获取器&#xff09;和Setter&#xff08;设置器&#xff09;是面向对象编程中用于控制对类属性访问的特殊方法。Getter用于获取属…...

使用融云 CallPlus SDK,一小时实现一款 1V1 视频应用

9 月 21 日&#xff0c;融云直播课 社交泛娱乐出海最短变现路径如何快速实现一款 1V1 视频应用&#xff1f; 欢迎点击小程序报名~ 1V1 音视频、远程服务类应用的实现利器——融云 CallPlus SDK 上线&#xff01; 关注【融云全球互联网通信云】了解更多 作为新一代音视频通话场…...

Redis Part1

单体架构&#xff1a;一台Web服务器、一台数据库服务器。 1.了解NoSql 什么是Nosql&#xff1f; NoSQL&#xff0c;即Not-Only-SQL&#xff0c;意思就是我们干事情不能只用SQL&#xff0c;泛指非关系型的数据库&#xff01;NoSQL定位&#xff1a;作为关系型数据库的补充&am…...

代理HTTP使用不当会出现哪些问题?如何正确使用代理服务?

代理HTTP是一种常见的网络代理方式&#xff0c;它为客户端和服务器之间提供中间层&#xff0c;转发上下游的请求和响应。正确使用代理HTTP可以提高采集效率、增加网络安全性、加速网络速度、保护用户隐私。但是&#xff0c;使用不当就难以达到预期的效果&#xff0c;在使用代理…...

利用芯片74hc165为单片机增加输入扩展端口proteus仿真arduino

我们前面的博文《输入端口少如何扩展&#xff1f;74hc148或74ls148级联在arduino中实现16转4的应用》介绍了148,148输入后可以立即输出到数码管&#xff0c;可以说它是自带编BCD编码器的。而今天这里我们主要介绍的74hc165是没有编码器&#xff0c;这里我们以proteus为仿真环境…...

docker真实IP解决

背景 在微服务的环境中使用docker部署各个应用&#xff0c;部分应用使用容器内的真实ip暴露出服务。会导致微服务之间调用出现网络超时&#xff0c;要解决这个问题需要让微服务暴露为宿主机的ip 解决 方式一 使用docker-compose的配置 network_mode: "host" emq…...

Linux 内存泄漏检测的基本原理

一、mtrace分析内存泄露 mtrace&#xff08;memory trace&#xff09;&#xff0c;是 GNU Glibc 自带的内存问题检测工具&#xff0c;它可以用来协助定位内存泄露问题。 它的实现源码在glibc源码的malloc目录下&#xff0c;其基本设计原理为设计一个函数 void mtrace ()&…...

Ubuntu下Nginx配置ModSecurity详细思路及过程

下面是一个简介&#xff1a; Ubuntu是一个linux操作系统&#xff0c;Nginx是一个web服务器软件&#xff0c;ModSecurity是一款开源的web应用防火墙&#xff08;江湖人称“WAF”&#xff09;。 如果上面的概念没有一定的了解&#xff0c;下面的内容其实也能看。就是不好操作。…...

入职美团近三个月,闲聊几句

校招入职美团近3个月&#xff0c;随便聊聊 今天和组内的小伙伴们团建来着&#xff0c;聊了很多&#xff0c;感触颇深&#xff0c;碎碎念一下。 作为组内的唯一的校招生&#xff0c;刚入职时面对复杂的业务&#xff0c;各种不熟悉的工具&#xff0c;真的是一脸懵。至少对我自己…...

setInterval倒计时切换页面后不准

背景 最近在做一个倒计时时&#xff0c;发现当切换浏览器tab后&#xff0c;再切回倒计时页面&#xff0c;倒计时的数据不准&#xff0c;比真正的剩余时间多&#xff0c;短时间还好&#xff0c;时间长了&#xff0c;计时器的误差会很大。 原因 倒计时是用setInterval每1000毫…...

信息安全三级概述

信息安全三级概述...

深入JVM:探索Java虚拟机

文章目录 1. JVM简介1.1 定义与核心作用1.2 JVM的跨平台特性 2. JVM内部结构深度探索2.1 类加载机制2.1.1 双亲委派模型2.1.2 OSGI框架2.1.3 类加载器分类 2.2 JVM运行时数据区2.2.1 程序计数器2.2.2 本地方法栈2.2.3 Java虚拟机栈 2.2.4 堆2.2.5 元数据区 2.3 JVM内存区域的性…...

【计算机网络】 RTT和RTO

文章目录 RTT——往返时延RTO&#xff08;Retransmission Timeout&#xff09;——超时重传时间 RTT——往返时延 RTT&#xff08;Round-Trip Time&#xff09;是计算机网络中的一个重要的性能指标&#xff0c;表示从发送端发送数据开始&#xff0c;到发送端接收到来自接收端的…...

Zabbix监控组件及流程

Zabbix 由5大组件构成 Zabbix Web、Zabbix Server、Zabbix Proxy、Zabbix Database、Zabbix Agent Zabbix监控系统具体监控系统流程如图&#xff1a; Zabbix Web Zabbix Web是基于PHP语言编写的WEB UI界面&#xff0c;展示Zabbix整个监控平台监控数据、配置信息、方便对整个…...

Type-C协议Ver2.0(学习笔记)

题记 本文以TYPE-C协议Ver2.0版本为基础&#xff0c;以直译为主&#xff0c;同时备注作者学习中遇到的问题与理解&#xff0c;如发现文中描述和协议原文有误&#xff0c;欢迎批评指正&#xff0c;感谢&#xff01; 1 简介 随着USB接口的持续成功&#xff0c;需要调整USB技术…...

智慧工地:实现作业区域安全管控

智慧工地是围绕工程现场人、机、料、法、环及施工过程中质量、安全、进度、成本等各项数据满足工地多角色、多视角的有效监管,实现工程建设管理的降本增效。 建设工程安全文明施工与质量提升,全方位的监测施工人员、各类器械设备、消防安全隐患&#xff0c;并提前对风险进行预警…...

【Unity插件】实现多人在线游戏——Mirror插件的使用介绍

文章目录 前言导入Mirror插件 简单介绍一、RPC调用二、错误注意 基本使用一、创建场景的网络管理器二、创建一个玩家三、添加玩家初始生成位置四、玩家控制五、同步摄像机六、同步不同角色的名字和颜色修改七、同步动画八、同步子弹方法一方法二 九、聊天功能十、场景同步切换十…...

【SpringBoot】100、SpringBoot中使用自定义注解+AOP实现参数自动解密

在实际项目中,用户注册、登录、修改密码等操作,都涉及到参数传输安全问题。所以我们需要在前端对账户、密码等敏感信息加密传输,在后端接收到数据后能自动解密。 1、引入依赖 <dependency><groupId>org.springframework.boot</groupId><artifactId...

Qwen3-Embedding-0.6B深度解析:多语言语义检索的轻量级利器

第一章 引言&#xff1a;语义表示的新时代挑战与Qwen3的破局之路 1.1 文本嵌入的核心价值与技术演进 在人工智能领域&#xff0c;文本嵌入技术如同连接自然语言与机器理解的“神经突触”——它将人类语言转化为计算机可计算的语义向量&#xff0c;支撑着搜索引擎、推荐系统、…...

WordPress插件:AI多语言写作与智能配图、免费AI模型、SEO文章生成

厌倦手动写WordPress文章&#xff1f;AI自动生成&#xff0c;效率提升10倍&#xff01; 支持多语言、自动配图、定时发布&#xff0c;让内容创作更轻松&#xff01; AI内容生成 → 不想每天写文章&#xff1f;AI一键生成高质量内容&#xff01;多语言支持 → 跨境电商必备&am…...

IT供电系统绝缘监测及故障定位解决方案

随着新能源的快速发展&#xff0c;光伏电站、储能系统及充电设备已广泛应用于现代能源网络。在光伏领域&#xff0c;IT供电系统凭借其持续供电性好、安全性高等优势成为光伏首选&#xff0c;但在长期运行中&#xff0c;例如老化、潮湿、隐裂、机械损伤等问题会影响光伏板绝缘层…...

css3笔记 (1) 自用

outline: none 用于移除元素获得焦点时默认的轮廓线 broder:0 用于移除边框 font-size&#xff1a;0 用于设置字体不显示 list-style: none 消除<li> 标签默认样式 margin: xx auto 版心居中 width:100% 通栏 vertical-align 作用于行内元素 / 表格单元格&#xff…...

深入浅出深度学习基础:从感知机到全连接神经网络的核心原理与应用

文章目录 前言一、感知机 (Perceptron)1.1 基础介绍1.1.1 感知机是什么&#xff1f;1.1.2 感知机的工作原理 1.2 感知机的简单应用&#xff1a;基本逻辑门1.2.1 逻辑与 (Logic AND)1.2.2 逻辑或 (Logic OR)1.2.3 逻辑与非 (Logic NAND) 1.3 感知机的实现1.3.1 简单实现 (基于阈…...

在Mathematica中实现Newton-Raphson迭代的收敛时间算法(一般三次多项式)

考察一般的三次多项式&#xff0c;以r为参数&#xff1a; p[z_, r_] : z^3 (r - 1) z - r; roots[r_] : z /. Solve[p[z, r] 0, z]&#xff1b; 此多项式的根为&#xff1a; 尽管看起来这个多项式是特殊的&#xff0c;其实一般的三次多项式都是可以通过线性变换化为这个形式…...

TSN交换机正在重构工业网络,PROFINET和EtherCAT会被取代吗?

在工业自动化持续演进的今天&#xff0c;通信网络的角色正变得愈发关键。 2025年6月6日&#xff0c;为期三天的华南国际工业博览会在深圳国际会展中心&#xff08;宝安&#xff09;圆满落幕。作为国内工业通信领域的技术型企业&#xff0c;光路科技&#xff08;Fiberroad&…...

Golang——7、包与接口详解

包与接口详解 1、Golang包详解1.1、Golang中包的定义和介绍1.2、Golang包管理工具go mod1.3、Golang中自定义包1.4、Golang中使用第三包1.5、init函数 2、接口详解2.1、接口的定义2.2、空接口2.3、类型断言2.4、结构体值接收者和指针接收者实现接口的区别2.5、一个结构体实现多…...

SpringAI实战:ChatModel智能对话全解

一、引言&#xff1a;Spring AI 与 Chat Model 的核心价值 &#x1f680; 在 Java 生态中集成大模型能力&#xff0c;Spring AI 提供了高效的解决方案 &#x1f916;。其中 Chat Model 作为核心交互组件&#xff0c;通过标准化接口简化了与大语言模型&#xff08;LLM&#xff0…...