1.新增页面刷新功能

loulijun2021

2023-01-31 5e16a06fc90a67907ba1afdf648a13ebb2ae1d59

1.新增页面刷新功能

 src/App.vue

@@ -1,13 +1,31 @@
<template>
  <div id="app">
    <!--    <keep-alive>-->
    <router-view />
    <router-view v-if="isShow" />
    <!--    </keep-alive>-->
  </div>
</template>

<script>
export default {
  name: 'App'
  name: 'App',
  provide() {
    return {
      reload: this.reload
    }
  },
  data() {
    return {
      isShow: true
    }
  },
  methods: {
    reload() {
      this.isShow = false
      this.$nextTick(() => {
        this.isShow = true
      })
    }
  }
}
</script>

 src/components/PageRefresh/PageRefresh.vue

ÎļþÒÑɾ³ý

 src/layout/components/Navbar.vue

@@ -12,22 +12,26 @@
        @toggleClick="toggleSideBar"
      />
      <!--      :style="{marginLeft:$store.state.settings.menuIsHorizontal?'50px':'40px'}"-->
      <!--      :style="{marginLeft:$store.state.settings.menuIsHorizontal?'20px':''}"-->

      <breadcrumb
        class="breadcrumb-container"
        :style="{marginLeft:$store.state.settings.menuIsHorizontal?'20px':''}"
        :style="{marginLeft:$store.state.settings.menuIsHorizontal?'60px':'40px'}"
      />

      <!--页面刷新功能  æš‚不开发   æœ‰éœ€æ±‚了再开发-->
      <!--      <el-tooltip class="item" effect="dark" content="刷新页面" placement="bottom">-->
      <!--                <PageRefresh-->
      <!--                  :style="{-->
      <!--                    color:$store.state.settings.headBackgroundColorValue?'#fff':'#000',-->
      <!--                    marginLeft:$store.state.settings.menuIsHorizontal?'20px':'50px'-->
      <!--                  }"-->
      <!--                  style="position: absolute;"-->
      <!--                  @click="pageRefreshClick"-->
      <!--                />-->
      <!--      </el-tooltip>-->
      <el-tooltip class="item" effect="dark" content="刷新页面" placement="bottom">
        <div
          :style="{
            color:$store.state.settings.headBackgroundColorValue?'#fff':'#000',
            marginLeft:$store.state.settings.menuIsHorizontal?'10px':'44px',
            position:'absolute',
          }"
          style="padding:0 8px"
          @click="pageRefreshClick"
        >
          <i class="el-icon-refresh-right" style="font-size: 20px;cursor: pointer;line-height:50px" />
        </div>
      </el-tooltip>

      <el-menu
        v-if="$store.state.settings.menuIsHorizontal"
@@ -147,7 +151,6 @@
import Search from '@/components/HeaderSearch'
import Screenfull from '@/components/Screenfull'
import variables from '@/styles/variables.scss'
import PageRefresh from '@/components/PageRefresh/PageRefresh'

export default {
  components: {
@@ -155,8 +158,7 @@
    Breadcrumb,
    Hamburger,
    Search,
    Screenfull,
    PageRefresh
    Screenfull
  },
  directives: { elDragDialog },
  data() {
@@ -200,6 +202,9 @@
      }
    }
  },
  inject: [
    'reload'
  ],
  created() {
    this.usercode = getCookie('navTabId')
    this.username = getCookie('username')
@@ -234,6 +239,10 @@
    }
  },
  methods: {
    pageRefreshClick() {
      console.log('点击了！')
      this.reload()
    },
    handleSelect(key, keyPath) {
      // console.log(key, keyPath)
    },