m0_65213775 2022-05-21 22:53 采纳率: 90.5%
浏览 26
已结题

路由映射路径报错问题!

路由配置:


Vue.use(VueRouter)

// 1.3创建Vuerouter对象
// const声明一个只读的常量,且声明后,常量的值是不能改变的

const router = new VueRouter({
    // routers配置路由映射关系的
    routers: [{
            //path=路径,为什么不是url,因为这里的路径不是完整的路径  component=组成部分
            path: '',
            redirect: '/vue-Home'
        },
        {
            path: '/vue-home',
            component: () =>
                import ('../src/pages/vue-home/vue-Home.vue')
        },
        {
            path: '/vue-class',
            component: () =>
                import ('../src/pages/vue-class/vue-Class.vue')
        },
        {
            path: '/vue-cart',
            component: () =>
                import ('../src/pages/vue-cart/vue-Cart.vue')
        },
        {
            path: '/vue-personal',
            component: () =>
                import ('../src/pages/vue-personal/vue-Personal.vue')
        }
    ]
})

export default router

方法:


export default {
  name:"TabBarItem",
  props: {
    path:String

  },
  methods: {
    itemClick(){
      this.$router.replace(this.path)
    }
  }

}

<router-view></router-view>
<TabBar>
     <TabBarItem path="/vue-home">
      <template #item-icon
          ><img src="../src/assets/img/home.png" alt=""
        /></template>
        <template #item-text><div>首页</div></template>
     </TabBarItem>
     <TabBarItem path="/vue-class">
      <template #item-icon
          ><img src="../src/assets/img/应用中心.png" alt=""
        /></template>
        <template #item-text><div>分类</div></template>
     </TabBarItem>
     <TabBarItem path="/vue-cart">
      <template #item-icon
          ><img src="../src/assets/img/购物车.png" alt=""
        /></template>
        <template #item-text><div>购物车</div></template>
     </TabBarItem>
     <TabBarItem pash="vue-personal">
      <template #item-icon
          ><img src="../src/assets/img/我的.png" alt=""
        /></template>
        <template #item-text><div>我的</div></template>
     </TabBarItem>
   </TabBar>

2个问题:

  1. 前3个都能正常点击,第4个点击就报错

    img

  2. 明明写了首页跳转的映射,也不知道为什么不生效

实在找不到哪里有问题了,帮忙看一下

  • 写回答

1条回答 默认 最新

  • 汤卓杰 2022-05-21 23:15
    关注

    报错信息的意思是:在某某文件某某组件中,name属性未定义。
    你的vue-personal,一个P大写,一个小写,就找不到,报错undefined

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

问题事件

  • 系统已结题 5月31日
  • 已采纳回答 5月23日
  • 创建了问题 5月21日

悬赏问题

  • ¥30 STM32 INMP441无法读取数据
  • ¥100 求汇川机器人IRCB300控制器和示教器同版本升级固件文件升级包
  • ¥15 用visualstudio2022创建vue项目后无法启动
  • ¥15 x趋于0时tanx-sinx极限可以拆开算吗
  • ¥500 把面具戴到人脸上,请大家贡献智慧
  • ¥15 任意一个散点图自己下载其js脚本文件并做成独立的案例页面,不要作在线的,要离线状态。
  • ¥15 各位 帮我看看如何写代码,打出来的图形要和如下图呈现的一样,急
  • ¥30 c#打开word开启修订并实时显示批注
  • ¥15 如何解决ldsc的这条报错/index error
  • ¥15 VS2022+WDK驱动开发环境