页面刷新和全屏功能

350 阅读1分钟

刷新用下面的方法

function handleRefresh(){
  location.reload()
}

全屏需要vueuse

npm i @vueuse/core

在Header中引用

import { useFullscreen } from '@vueuse/core'

const {
// 是否全屏状态
isFullscreen, 
// 切换全屏
toggle 
} = useFullscreen()

调用即可

      <el-icon class="icon-btn" @click="toggle">
        <full-screen />
      </el-icon>

全屏后切换图标 用v-if判断

      <el-icon class="icon-btn" @click="toggle">
        <full-screen v-if="!isFullscreen"/>
        <Aim v-else />
      </el-icon>