History模式 带参数链接刷新后显示404的问题
in 前端 with 0 comment

History模式 带参数链接刷新后显示404的问题

in 前端 with 0 comment

已经按照Vue Router文档配置了nginx

location / {
  try_files $uri $uri/ /index.html;
}

当使用这样的方式跳转页面后,刷新页面会触发404

this.$router.push({
  path: '/info',
  query: {
    id
  }
})
// 浏览器url http://www.aaa.com/farmInfo?id=aaa

image-20211111104434913-16365986764621.png

解决方法:使用动态路由匹配

// router.js
{
    name: 'info',
    path: '/info/:id',
    component: () => import('@/views/Info.vue')
}

// 使用param传参
this.$router.push({
    name: 'farmInfo',
    params: {
        id: id
    }
})
Comments are closed.