YGG-CLI-11-全屏与取消全屏

一个文笔一般,想到哪是哪的唯心论前端小白。

🧠 - 简介

全屏与取消实在不想新写一篇了,但是放在哪里都不合适,就占一篇吧!

👁️ - 分析

没分析。

🫀 - 拆解

没拆解。

💪 - 落实

哦哦,落实了,落实了!!!

ts 复制代码
import { useFullscreen } from '@vueuse/core';

const { isFullscreen, toggle } = useFullscreen(body)

// 绑定在按钮上
const handleFullScreen = () => {
    toggle()
}

🛀 - 总结

对,没有造轮子,我学聪明了呢!!!

其实,这就是在操作浏览器的默认行为,调用一下就好啦!

[MDN] Document.fullscreenElement 嗖 ~

系列文章:

  1. 脚手架开发
  2. 模板项目初始化
  3. 模板项目开发规范与设计思路
  4. layout设计与开发
  5. login 设计与开发
  6. CURD页面的设计与开发
  7. 监控页面的设计与开发
  8. 富文本编辑器的使用与页面设开发设计
  9. 主题切换的设计与开发并页面
  10. 水印切换的设计与开发
  11. 全屏与取消全屏
  12. 开发提效之一键生成模块(页面)
相关推荐
二哈喇子!19 小时前
BOM模型
开发语言·前端·javascript·bom
二哈喇子!19 小时前
Vue2 监听器 watcher
前端·javascript·vue.js
yanyu-yaya20 小时前
前端面试题
前端·面试·前端框架
二哈喇子!20 小时前
使用NVM下载Node.js管理多版本
前端·npm·node.js
GGGG寄了20 小时前
HTML——文本标签
开发语言·前端·html
摘星编程21 小时前
在OpenHarmony上用React Native:ActionSheet确认删除
javascript·react native·react.js
2501_9445215921 小时前
Flutter for OpenHarmony 微动漫App实战:推荐动漫实现
android·开发语言·前端·javascript·flutter·ecmascript
Amumu121381 天前
Vue核心(三)
前端·javascript·vue.js
CoCo的编程之路1 天前
2026 前端效能革命:如何利用智能助手实现“光速”页面构建?深度横评
前端·人工智能·ai编程·comate·智能编程助手·文心快码baiducomate
RFCEO1 天前
HTML编程 课程五、:HTML5 新增语义化标签
前端·html·html5·跨平台·语义化标签·可生成安卓/ios·html最新版本