基于Vue+package编写项目时遇到的问题

问题一:
(1)写了关于路由配置的代码如下:

export default new Router({
  routes: [
    {
      path: '/',
      name:'Hello World',
      component: HelloWorld,
--------------------------------------------------------
children: {
        path: '/',
        name:'topBar',
        component: topBar
      }
    }
----------------------------------------------------------
  ]
})

发生了如下错误:
这里写图片描述
发生上述错误的原因是children的写法错误,改正后的代码为:

export default new Router({
  routes: [
    {
      path: '/',
      name:'Hello World',
      component: HelloWorld,
--------------------------------------------------------
children:[ {
        path: '/',
        name:'topBar',
        component: topBar
      }
    }]
----------------------------------------------------------
  ]
})

问题二:
(2)上述问题改正后,又出现了如下的错误:

[vue-router] Named Route ‘HelloWorld’ has a default child route. When
navigating to this named route (:to=”{name: ‘HelloWorld’”), the
default child route will not be rendered. Remove the name from this
route and use the name of the default child route for named links
instead.

解决办法:
因为当某个路由有子级路由的时候,这时候父级路由需要一个默认的路由,所以父级路由不能定义name属性。

故解决办法是:即去除父级的name属性即可

问题三:
我在components文件夹下新创建了一个文件nav.vue

import '../assets/base.css'
export default {
  name: 'nav'
}

vue在引入组件后,出现了如下的错误:
这里写图片描述
问题的原因是:
在注册组件时nav时,因为nav是HTML中已经存在的标签,故会出现错误。
解决办法:
(1)修改nav.vue为topBar.vue
(2)将上面代码里的name修改成如下即可:

import '../assets/base.css'
export default {
  name: 'topBar'
}

猜你喜欢

转载自blog.csdn.net/Kratial/article/details/82254712
今日推荐