router-link 和 router-view的区别

router-link 实现路由之间的跳转
router-view (路由出口组件 -> 渲染路径匹配到的视图组件

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

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博客

相关推荐
比奥利奥还傲.8 小时前
哪吒监控面板实战:部署 Dashboard、接入 Agent、钉钉告警,再配置固定公网访问
网络·人工智能·分布式·1024程序员节
Mr YiRan13 小时前
网络请求API监控与网络切换埋点
android·网络
AlienZHOU14 小时前
AI Coding 时代下,我的技术面试实践分享
前端·后端·面试
Captaincc17 小时前
AI用量v0.1.11更新发布 新增 jusage doctor 诊断指令 托盘展示token 和余额 新增 AutoClaw 支持
前端·后端·vibecoding
计算机魔术师18 小时前
德国Wiki被黑后两周,OpenAI终于把模型失控的账本摊开了
前端
kyriewen19 小时前
我让 AI 当面试官面了我一轮:第 3 个追问我就卡住了(附 10 道追问清单)
前端·面试·ai编程
IT_陈寒19 小时前
Python的GIL把我坑惨了,多线程跑得比单线程还慢
前端·人工智能·后端
前端snow19 小时前
ai agent --- 多agent框架之图编排引擎-langgraph
前端
当下新鲜事19 小时前
车间实测记录:三菱电机MR-J5伺服与压力控制方案的场景适配
网络·物联网·业界资讯
竹林81819 小时前
OmniPic Studio v3.2.1 核心技术架构与全平台发版解析文档
前端·浏览器