在学习《vue技术栈开发实战》中beforeRouteUpdate没有触发
router.js代码
import Home from '@/views/Home.vue'
export default [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/argu/:name',
component: () => import( '@/views/argu.vue'),
props: true
},
{
path: '/about',
name: 'about',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ '@/views/About.vue')
}
]
argu.vue代码
<template>
<div>
{{ name }}
</div>
</template>
<script>
export default {
props: {
name: {
type: String,
default: 'apple'
}
},
beforeRouteUpdate (to, from, next) {
console.log(to.name,from.name)
next()
}
}
</script>
访问页面从http://10.0.0.150:8080/argu/apple跳转到http://10.0.0.150:8080/argu/banana,页面显示发生了变化,但是在console没有输出,beforeRouteUpdate未被触发,新手求解惑,谢各位大神
beforeRouteUpdate的触发是在动态路由情形下,比如 path: '/user/:userName' 这条路由,当页面不变更只动态的改变参数userName时,beforeRouteUpdate便会触发