页面重新加载后,vue路由器推送不工作

kxe2p93d  于 2023-04-07  发布在  Vue.js
关注(0)|答案(1)|浏览(223)

我有一个函数,添加一个随机名称的月份的网址,它停止工作,如果点击后的功能重新加载页面,网址没有改变,有什么问题?

export default {
  data() {
    return {
      filters: [],
      mounts: [
        'january',
        'february',
        'march',
        'april',
        'may',
        'june',
        'july',
        'august',
        'september',
        'october',
        'november',
        'december',
      ],
    }
  },
  watch: {
    '$route.params.filter': function (value) {
      console.log('value:', value)
    },
  },
  mounted() {
    const routeFilters = this.$route.params.filter

    if (Array.isArray(routeFilters) && routeFilters.length > 0) {
      this.filters = routeFilters
    }
  },
  methods: {
    onClick() {
      const randomIndex = Math.floor(Math.random() * this.mounts.length)
      this.filters.push(this.mounts[randomIndex])
      const path = `/auth/${this.filters.join('/')}/`
      this.$router.push({ path })
    },
  },
}
xdyibdwo

xdyibdwo1#

使用vue-router时,页面不应该被重新加载。如果这是所需的功能,请重新加载各个组件。当设置'path'时,您将以'/'开头并以'/'结尾。尝试删除路径周围的{ }。如果您将'path'字符串直接放入.push,如下所示:

this.$router.push(`/auth/${this.filters.join('/')}/`);

你应该注意到

this.$router.push({`/auth/${this.filters.join('/')}/`});

(what你现在有)是一个语法错误。

相关问题