vue基础之动态路由
发布日期：2021-05-18 08:43:50
浏览次数：30
分类：原创文章
本文共 962 字，大约阅读时间需要 3 分钟。
文章目录
前言
学习vue基础之动态路由，不同标识渲染同一个组件
一.动态路由代码
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>动态路由的写法</title> </head> <body> <div id="app"> <router-link to="/a">首页</router-link> <router-link to="/b">热点</router-link> <router-link to="/c">视频</router-link> <router-view></router-view> </div> </body></html><!--在线引入vue.js--><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/vue"></script><!--在线引入vue-router.js--><script src="https://unpkg.com/vue-router/dist/vue-router.js"></script><script type="text/javascript"> //提供渲染的作用 //想知道动态路由配置的path的值是什么 var component = "<div>{ {$route.params.id}}</div>"; //创建vue-router，并且配置路由 var router = new VueRouter({ routes:[ { //:id 参数名,其值是变化的 path:"/:id", component:{ template:component } } ] }); //创建vue实例，并且绑定路由 new Vue({ el:'#app', router:router //在vue众绑定vue-router });</script>示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。
二、实现效果
总结
学习vue基础之动态路由
发表评论
最新留言
初次前来，多多关照！
[***.217.46.12]2025年04月18日 01时27分30秒
关于作者
喝酒易醉，品茶养心，人生如梦，品茶悟道，何以解忧？唯有杜康！
-- 愿君每日到此一游！
推荐文章
0基础成功转行网络安全工程师，年薪30W+，经验总结都在这（建议收藏）
2025-03-29
100个电脑常用组合键大全（非常详细）零基础入门到精通，收藏这篇就够了
2025-03-29
10个程序员可以接私活的平台
2025-03-29
10个程序员可以接私活的平台（非常详细）零基础入门到精通，收藏这篇就够了
2025-03-29
10条sql语句优化的建议
2025-03-29
10款宝藏编程工具！新手必备，大牛强烈推荐！ 从零基础到精通，收藏这篇就够了！
2025-03-29
10款最佳免费WiFi黑客工具（附传送门）零基础入门到精通，收藏这一篇就够了
2025-03-29
15个Python数据分析实用技巧（非常详细）零基础入门到精通，收藏这一篇就够了
2025-03-29
15个备受欢迎的嵌入式GUI库，从零基础到精通，收藏这篇就够了！
2025-03-29
15个程序员常逛的宝藏网站！！从零基础到精通，收藏这篇就够了！
2025-03-29
1分钟学会在Linux下模拟网络延迟
2025-03-29
200款免费的AI工具汇总
2025-03-29
2023年失业的你明白了什么道理？
2025-03-29
00后整顿职场？公司测试岗却新来了个00后卷王，3个月薪资干到20K...
2025-03-29
2023应届毕业生找不到工作很焦虑怎么办?
2025-03-29
2023网络安全现状，一个（黑客）真实的收入
2025-03-29
2024 年需要了解的顶级大数据工具（非常详细）零基础入门到精通，收藏这一篇就够了
2025-03-29
白红宇的个人博客 - 记录点点滴滴的事 - 您是第 465591146 位访客
访问时间: 2025-05-13 04:05:54
访问IP: 3.148.233.130
Copyright © 2020 - 2025 css8.cn 京ICP备2021015314号-1
手机版