vue中有一个appvue页面里面有navBar组件和router-view占位符路由跳转怎么刷新在navBar组件

中显示的数据？

1. 在navBar组件中使用computed属性监听当前路由对象，例如：

<template>
  <div>
    <h1>{{ currentRouteTitle }}</h1>
  </div>
</template>

<script>
export default {
  computed: {
    currentRouteTitle () {
      return this.$route.meta.title
    }
  }
}
</script>

2. 在路由配置中给每个路由对象设置meta属性，用来描述该路由的一些元数据，例如：

const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home,
    meta: {
      title: '首页'
    }
  },
  {
    path: '/about',
    name: 'About',
    component: About,
    meta: {
      title: '关于我们'
    }
  }
]

这样，在路由跳转时，navBar组件的computed属性会自动更新，从而刷新显示的数据