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. 开发提效之一键生成模块(页面)
相关推荐
Predestination王瀞潞9 分钟前
5.4.3 通信->WWW万维网内容访问标准(W3C):WWW(World Wide Web) 协议架构(分层)
前端·网络·网络协议·架构·www
爱学习的程序媛19 分钟前
【Web前端】优化Core Web Vitals提升用户体验
前端·ui·web·ux·用户体验
zabr20 分钟前
花了 100+ 篇笔记,我整理出 了一套 AI Agent 工程完全指南
前端·后端·agent
软弹32 分钟前
深入理解 React Ref 机制:useRef 与 forwardRef 的协作原理
前端·javascript·react.js
YaHuiLiang36 分钟前
Ai Coding浪潮下的前端:“AI在左,裁员在右”
前端
雪碧聊技术44 分钟前
前端vue代码架子搭建
前端·javascript·vue.js·前端项目代码框架搭建
爱学习的程序媛44 分钟前
【Web前端】前端用户体验优化全攻略
前端·ui·交互·web·ux·用户体验
han_1 小时前
JavaScript设计模式(二):策略模式实现与应用
前端·javascript·设计模式
x***r1511 小时前
Notepad++ 8.6 安装教程:详细步骤+自定义安装路径(附注意事项)
linux·前端·javascript
Hilaku1 小时前
为什么很多工作 5 年的前端,身价反而卡住了?🤷‍♂️
前端·javascript·面试