发表于： 2020-07-06 22:14:02
1 2214
今日完成:
遇到问题:
描述:
‘/‘是根目录的意思
path:'/',
component: main,
意思是根目录显示(映射路径)组件main(页面main)
路径：
却没显示组件main的路径,就是:localhost:8080/main
这里我在组件main下,添加多个子路由,映射关系失效(无法切换)
原因:
代码
path:'/',
component: main,
是根目录显示组件main,而不是跳转到main,即:localhost:8080/main
js代码能正常实现,但是映射关系因为路径问题错误
搜索框显示的地址就可以看出,如果要在这种情况下能正常切换子路由,应该把它们都挂载到跟目录"/"下
或者:在:localhost:8080/main下,组件main下的子路由映射关系正常,
但是切换到页面main时,显示的页面因为有多个子路由,所以也有类似根目录的初始子路由
我开始模仿根目录写成
{
path: '/main',
name: 'main',
component: main,
children:[
{
path: '/',
name: 'wel',
component: wel
},
这样设置默认路由,能正常显示,但是浏览器会警告
网上答案:当某个路由有子集路由的时候，这时候父级路由需要一个默认的路由，所以父级路由不能定义name属性。
解决办法：即去除父级的name属性即可
和上面的翻译,login,有个默认的子路由,默认子路由不渲染,感觉都跟这个警告无关,
正确做法是用重定向来做默认路径,不会警告
{
path: '/login',
name: 'login',
redirect:'wel',
component: login,
children:[
{
path: '/wel',
name: 'wel',
component: wel
},
上述代码
{
path: '/main',
name: 'main',
component: main,
children:[
{
path: '/',
name: 'wel',
component: wel
会报出错误:
Vue在引入组件后无法显示组件内容且报错如下：
[Vue warn]: Do not use built-in or reserved HTML elements as component id: main
二、原因是vue里面不允许用特殊的标签来做自定义的标签比如你不能用a来接收一个组件的注册然后在以自定义标签的方式引用会被限制
三、解决方案
在component里面注册组件的时候避免用html已有的标签来接收组件
ps:属性的类名可以使用,但是例如:路径名,组件名尽量避免,或者加前缀后缀也行
vue-cli3 脚手架搭建完成后，项目目录中没有 vue.config.js 文件，需要手动创建
注意,项目运转起来后,在配置这个文件时项目出错,可能不会报错,
但下次项目运转时,就会报错,而且显示npm错误,但是没说哪个文件错误,就有可能是是vue.config.js发生的错误,
可以删掉,尝试是否是它配置错误
或者说,vue.config.js配置出错,vue cli报错可能会指向npm的,且没有具体指向
所以，尽量不要随意乱改依赖包，以及其他配置，所有的东西，都要在项目初始阶段就配置好，
如有必要，项目提前备份
返回列表
评论