vue-router中name的使用注意事项

最新推荐文章于 2024-05-15 17:30:55 发布
最新推荐文章于 2024-05-15 17:30:55 发布
阅读量2.7k 收藏
点赞数 1
分类专栏： Vue.js 错误解决方法 文章标签： vue-router name
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/liuhailong2014/article/details/90814162
版权

先上一个图

 这是在运行网站时浏览器给出的一个警告，但不会影像网站的运行，大体意思就是说：“名为index的路由包含有默认的子路由，如果你想要导航到这个路由的话，它的默认子路由是不会渲染的，建议从这个路由上面移除这个name属性，或者给它的子路由设置name”，对于一个追求完美的coder来说，一个小小的警告也是不能允许的！！！

下面开始填坑，很简单把这个name放到当前路由的默认子路由上面就行了，哈哈哈！！！

飞翔的小猿
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue 路由命名
MCCLS的博客
07-30 369
要点： 直接在配置路由里面加入一个配置项 name这样可以让部分代码简化 原来外面配置跳转路径的时候,要写全路径 而有了name就不需要写路径直接写name就行 但是如果这边直接写name名,它就会认为这其实是一个path名就会找不到，就会什么都不显示 所以要加冒号并引号里面写成对象进行name的配置 总结： ...
vue router （忽略路由名字）
沙鑫741的博客
06-27 614
vue router export default new Router({ mode: 'history', routes: [ { path: '/', name: 'HelloWorld', component: HelloWorld }, { path: '*', name: 'NotFound', comp...
Vue3实战笔记（23）—路由Vue-Router 实战指南（关于路由命名那点事儿）
最新发布
山花的博客
05-15 1278
除了 path 之外，你还可以为任何路由提供 name。在 Vue Router 中，命名路由是一种通过指定名称来标识路由的方式，而不是使用路径。这为路由的跳转提供了一种更直观和易于维护的方式。命名路由特别有用，尤其是在链接到路由时，不必硬编码 URL，也不必在路由对象中查找路径字符串。},在这个例子中，我们给路径为 /user/:username的路由命名为 user。User在这两种情况下，路由将导航到路径 /user/erina。
HTML中id、name、class 区别
轻轻草原
10-17 1417
HTML 中 id与name 区别 一个name可以同时对应多个控件，比如checkbox和radio 而id必须是全文档中唯一的 id的用途1） id是HTML元素的Identity，主要是在客户端脚本里用。 2） label与form控件的关联，如 <label for="MyInput">My Input</label> <input id...
vue-router的routes中name属性作用详解
m0_60237095的博客
08-16 6772
我们常用vue.js和vue-router来创建单页应用，vue-router能很方便的管理所有的单页组件。我们在定义每个路由的时候会有一个name的属性（如下面代码），通常我们不定义这个属性发现也没有任何问题，那么这个name到底有什么用呢？ export default new Router({ mode: 'history', routes: [ { path: '/', name: 'Hello', component: Hello ...
说说Vue-Router和Vue组件中的name属性的使用区别
青春木鱼的博客
12-10 3257
Vue和Vue-Router中的name没有直接联系，是两个不同的概念！
vue项目中: 在外部js文件中获取当前页面的路由名route.name
weixin_50723565的博客
10-14 7778
js文件中如何获取$route.name
router 的name属性，重定向，传参
code_J的博客
04-27 569
name属性 绑定组件 通过name属性，为一个页面中不同的router-view渲染不同的组件,如：将上面代码的Hello渲染在 name为Hello的router-view中，将text渲染在name为text的router-view中。不设置name的将为默认的渲染组件。 <router-view name="Hello"></router-view> //将渲染Hello组件 <router-view name="text"></router-v
Vue3-31-路由-RouterView的name属性的作用
northcastle的博客
12-29 1620
vue3 中 路由 的 指定name属性，实现 一个路由渲染多个组件
router-view 设置name不生效
Lucilfer的博客
11-12 156
图一是路由的配置,图二是渲染对应的组件,图三是点击效果,图四是效果图,请问设置一个默认的router-view和加了name属性的两个区域都能被显示出来,但是单独使用加了name属性的就没有效果是怎么回事了(ps:纯小白,这个是考核作业,希望能得到大家的帮助)
用this.$route.name获取当前路由name
你若盛开，清风自来
07-26 6071
在 components 文件夹下新建一个文件MyNav.vue 在MyNav.vue文件下写代码 template 模板里面书写： <template> <div class="nav"> <!-- 这个name是计算属性 --> <div class="nav-item" :class="{select :name === 'Index'}" @click="to('Index')"> <div class=".
vue2 route包含的信息和router使用的详细介绍 vue3 useRouter和useRoute 使用以及三种传参方式
青山不改，绿水长流。
09-26 8957
传递和接收方式不同外显式query会很明显的跟在新的url上，而隐式params不会隐式params在刷新后可能会消失，我们可以在它存在的时候存如缓存中，如localstorage，而query不会隐式params比显式query相对而言更安全，不会将参数直接暴露给用户。
Vue.js——vue-router 60分钟快速入门
dengjie0448的博客
07-21 1034
概述 vue-router是Vue.js官方的路由插件，它和vue.js是深度集成的，适合用于构建单页面应用。vue的单页面应用是基于路由和组件的，路由用于设定访问路径，并将路径和组件映射起来。传统的页面应用，是用一些超链接来实现页面切换和跳转的。在vue-router单页面应用中，则是路径之间的切换，也就是组件的切换。 本文将以示例的形式来介绍vue-router的各个特性，一共包...
vue父子传值和传方法
qq_43541326的博客
05-07 376
父组件给子组件传值 父组件代码 子组件代码 效果图 传多个值 效果图 父组件给子组件传方法 父组件代码 子组件接收方法代码 效果 更厉害的把整个父组件传给子组件 父组件代码 子组件代码 效果 下面是获取方法 效果 父组件获取子组件值 这是子组件代码 这是父组件代码 效果 使用ref方法 来获取子组件的数据和方法 1：获取子组件的数据 父组件代码 子组件代码 效果...
vue3 route和router的区别以及如何传参数接受参数，如何像vue2一样使用$route和$router详解
大胆刁民的博客
08-23 7068
因为我们在 里面没有访问 ，所以我们不能再直接访问 或 。作为替代，我们使用 和函数,或者 Vue3 中提供了一个 方法来获取当前 Vue 实例 Vue Router 和 组合式 API | Vue Router (vuejs.org)vue3 是用来操作路由的，是用来获取路由信息的。route.path 字符串，等于当前路由对象的路径，会被解析为绝对路径，如/home/ewsroute.params 对象，包含路由中的动态片段和全匹配片段的键值对，不会拼接到路由的url后面route.query 对
vue命名路由（name的使用）
zyy_wx的博客
09-26 945
vue命名路由（name的使用）
路由vue-route的使用
python全栈
11-14 3281
{访问路由：http://localhost:8080/#/user/666UserView.vue组件。
vue3 router route
09-27
Vue Router是一个官方的Vue.js路由管理器，它与Vue.js核心深度集成，提供了路由管理和导航功能。在Vue 3中，使用Vue Router需要进行安装和...使用Vue Router时需要注意一些事项，比如使用懒加载、路由的动态导航等。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值