Vue.js 使用axios时，Vue路由器历史记录模式不工作

我想从

http://localhost:5438/api/change?id=123

访问时

http://localhost:8080/change/detail/123

，但在使用历史记录模式时它不起作用

开发配置

assetsPublicPath: '/',
    proxyTable: {
        '/api': {
        target: 'http://127.0.0.1:5438/api/',
        changeOrigin: true,
        pathRewrite: {
            '^/api': ''
        }
    }
},

{
    path: '/change/detail/:id',
    name: 'ChangeDetail',
    component: ChangeDetail
}

路由器配置

assetsPublicPath: '/',
    proxyTable: {
        '/api': {
        target: 'http://127.0.0.1:5438/api/',
        changeOrigin: true,
        pathRewrite: {
            '^/api': ''
        }
    }
},

{
    path: '/change/detail/:id',
    name: 'ChangeDetail',
    component: ChangeDetail
}

更改详细信息

this.$axios.get('api/change?id=' + id)
    .then(response => {
        ......
    })

然而，我发现axios实际调用的url是

http://localhost:8080/change/detail/api/change?id=123

而不是

http://localhost:8080/api/change?id=123

但是当我关闭历史记录模式时，当url转到

http://localhost:8080/#/change/detail/123

---

那怎么了？请帮我找到解决办法。提前感谢。

您在axios中使用的是相对路径（相对于当前URL路径）。请改用绝对路径，因为它实际上就是您在

代理表

中拥有的路径，即

/api/change

。投票结束typo@Phil谢谢，你的意思是把

这个。$axios.get（'api/change？id='+id）

改成

这个。$axios.get（'/api/change？id='+id）

？我试过了，但结果还是一样。是的，我就是这个意思。我非常怀疑它是否会产生同样的问题，除非您已将axios设置为使用未显示的

baseUrl

。@Phil好的，它现在可以工作了，谢谢@Ruchernchung这真的不值得，这只是一个打字错误