vue中全局引入的组件如何在特定页面不引入？

在项目中会引入一些全局组件如header.vue、footer.vue等，但在一些页面中并不需要引入，如登录、登出页。

做法：在APP.vue文件中

<div v-if="headerShow">
    <header-nav></header-nav>
</div>

import header from "./components/header.vue";
export default {
  name: "app",
  data() {
    return {
      headerShow: true
    };
  },
  components: {
    headerNav: header
  },
  watch: {
    $route(to, from) {
      if (this.$route.path === "/couponPage" || "/agreement") {
        this.headerShow = false;
      } else {
        this.headerShow = true;
      }
      if (this.$route.path === "/" || this.$route.path === "/homePage") {
        this.headerShow = true;
      }
    }
  }

以上"/couponPage"及"/agreement"页面为不显示全局组件的页面，"/homePage"为显示全局组件的页面。