vue.js - 如何解决Vue router change error with param?

标签 vue.js vuejs2 vue-component vue-router

工具栏上有 3 个按钮(HOME、CARD、LOAN),当我单击它们时,它们会转到 'home''list/card',和 'list/loan' 分别。

这是我的 router.js 代码,用于 'list/card''list/load'

{
        path: '/list/:id',
        name: 'listview',
        component: ListView
},

当我点击借贷页面的CARD或卡片页面的LOAN时,浏览器地址栏的URL变了,但是页面内容没有改变。

如果我在其他页面(例如 HOME 页面)上单击这些按钮中的任何一个,它就会起作用。

这是点击按钮时的代码

gotoPage(path) { // here path='/list/loan or path='/list/card'
   this.$router.push({ path: path })
}

这是listview组件的代码

created: function () {
    this.loadUsers(this.$route.params.id)
},

问题是这个 created 钩子(Hook)函数在这种情况下不起作用。

请帮帮我!!

最佳答案

添加更新的钩子(Hook)函数。

像这样

created: function () {
    this.loadUsers(this.$route.params.id)
},
updated: function () {
    this.loadUsers(this.$route.params.id)
}

它会起作用。

关于vue.js - 如何解决Vue router change error with param?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54158128/

相关文章:

javascript - Vue2 : JSON object using emit not working?

javascript - 如何销毁 <keep-alive> 缓存的 VueJS 组件

typescript - ESLint 不相信我在 tsconfig 中包含了 .vue 文件

javascript - 如何制作 DIV 的 v-for 循环并按部分显示它们 (Vue.js)

vue.js - 单击 vue 组件中的保存按钮后如何关闭模式?

vue.js - 根据文档,通过 `data` 访问 `wrapper.vm` 属性是否正确?

javascript - 将 Django 数据传递给 Vue 组件

javascript - Vue 和 Vuex : computed property isn't called when changing state

javascript - Vue js 和数据表分页不起作用

javascript - 减慢 Django Web 应用程序中 Vue.js 更新方法中的请求速率