1. 程式人生 > 程式設計 >Vue實現頁面的區域性重新整理(router-view頁面重新整理)

Vue實現頁面的區域性重新整理(router-view頁面重新整理)

利用裡面的provide+inject組合

首先需要修改App.vue。

<template>
  <!-- 公司管理 -->
  <div class="companyManage">
    <router-view v-if="isRouterAlive"></router-view>
  </div>
</template>

<script>
export default {
  name: "companyManage",watch: {},provide() {
    return {
      reload:this.reload
    }
  },data() {
    return {
      isRouterAlive:true
    };
  },methods: {
    reload() {
      this.isRouterAlive = false;
      this.$nextTick( () => {
        this.isRouterAlive = true;
      })
    }
  },mounted() {}
};
</script>

<style scoped&http://www.cppcns.com
gt; .companyManage { width: 100%; height: 100%; position: relative; background: #fff; } </style>

在這裡插入圖片描述

2. 到需要重新整理的頁面進行引用,使用inject匯入引用reload,然後直接呼叫即可。

在這裡插入圖片描述

inject:["reload"],this.reload();

在這裡插入圖片描述

到此這篇關於Vue實現頁面的區域性重新整理(router-view頁面重新整理)www.cppcns.com的文章就介紹到這了,更多相關Vue 頁面區域性重新整理內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!