Vue.js 没有正确更新 URL答案

【问题标题】：Vue.js not updating URL correctlyVue.js 没有正确更新 URL
【发布时间】：2020-01-29 16:52:30
【问题描述】：

加入.vue

<template>
  <div class="container join-form">
    <form>
      <div class="container">
        <h2>Join to session</h2>
      </div>
      <div class="form-group">
        <label for="sessionId">Session ID:</label>
        <input v-model="sessionId" class="form-control" type="text" name="sessionId" placeholder="Session ID">
      </div>
      <div class="form-group">
        <label for="userName">Username:</label>
        <input v-model="userName" class="form-control" type="text" name="userName" placeholder="Your name">
      </div>
      <button v-on:click.prevent="joinSession()" class="btn btn-primary">Join session</button>
    </form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      userName: "",
      sessionId: this.$route.params.sessionId,
      userId: null
    };
  },
  methods: {
    joinSession() {
      this.$http
        .post('/joinsession', {
          userName: this.userName,
          sessionId: this.sessionId
        })
        .then(
          data => {
            this.userId = data.body.userId;
            this.$router.push("/user/" + this.sessionId + "/" + this.userId);
          },
          () => {
            this.$router.push("/error");
          }
        );
    }
  }
};
</script>

<style>
.join-form {
  width: 50%;
}
</style>

我想要 "/user/{sessionId}/{userId}" 但我有

“http://projectx.laragon:8090/user/3/[object%20Object],[object%20Object]”

我该如何解决这个问题？我将 Laravel 与 Vue-Resource &% Vue-Router 结合使用，以便在 App.vue 中的不同 .vue 文件之间切换。这意味着我的 URL 没有主动输入，它只是显示而不从服务器获取。

例如：“user/{userId}/{sessionId}”如果我没有在我的 web.php 中注册它是 404

【问题讨论】：

在push 之前给你console.log(this.userId, this.sessionId) 是什么？

标签： php laravel vue.js

【解决方案1】：

看来你真的很想做

this.$router.push( { path: '/user', params: { sessionId: this.sessionId, userId: this.userId } });

如果还是不行，检查你的路由配置和sessionId/userId值。

有关详细信息，请参阅docs

【讨论】：