超好用的API之IntersectionObserver
这是个还在草案中的API,不过大部分浏览器均已实现(除了IE)。先看下MDN中的介绍: IntersectionObserver接口提供了一种异步观察目标元素与祖先元素或顶级文档 的交集中的变化的方法。祖先元素与视窗viewport被称为 根(root)。 不知大家有没有发现随着网页发展,对 检测某个(些)元素是否出现在可视窗 相关的需求越来越多了?比如: 当页面滚动时,懒加载图片或其他内容。 实现“可无限滚动”网站,也就是当用户滚动网...
Vue使用wangEditor富文本编辑器报错(ot find a descendant at path [0,1] in node: {“children“:[{“type“:“paragraph)_cannot find a descendant at path [0,1] in node
答案 时渲染dom报错问题: 每题的答案 修改文字样式后切换报错 解决办法: 在动态切换答案回显的同时删除 wangEditor 的实例然后异步重新创建一遍进行回显 代码片段:
实现主题换肤( CSS 变量 + 类名切换)
实战引入: CSS变量 + 类名切换 通过arco design组件库的使用来了解如何切换主题 主要思路:CSS变量 + 类名切换(组件库提供/自己定义) + 将当前主题模式设置到localStorage + vuex状态管理theme 1. 定义CSS变量:因为CSS变量组件库已经配好一套黑白变量了,直接拿来用 2. 为body标签添加相关的属性,参考arcodesign官网: 设置到localStorage防止刷新之后主题恢复成默认...
前端主题切换方案
现在我们经常可以看到一些网站会有类似 的主题切换功能,效果也是十分炫酷,在平时的开发场景中也有越来越多这样的需求,这里大致罗列一些常见的主题切换方案并分析其优劣,大家可根据需求综合分析得出一套适用的方案。 方案1:link标签动态引入 其做法就是提前准备好几套 主题样式文件,在需要的时候,创建 标签动态加载到 标签中,或者是动态改变 标签的 属性。 表现效果如下: 网络请求如下: 优点: 实现了按需加载,提高了首屏加载时的性能 缺点:...
JSPDF + html2canvas A4分页截断
引言 最近在业务上遇到了一个问题是要将页面打印输出成pdf文件,通过点击一个按钮,就能够将页面写在一个pdf上,并下载下来,需要保证pdf的内容具有很好的可读性。 经评估要实现这个需求,一种可行的方案是将HTML页面转为PDF,并实现下载。通过技术调研,最终的方案确定为通过 \+ 这两个库来实现,通过使用 提供的方法,将页面元素转为 图片流,然后将其插入jspdf插件中,实现保存并下载pdf。 \+ 方案是前端实现页面打印的一种常用方案...
get请求参数放在body中?
与后端对接口时,看到有一个 请求的接口,它的参数是放在 中的 \ \ \ \ \ \ 请求参数可以放在 中?? 随即问了后端,后端大哥说在postman上是可以的,还给我看了截图 可我传参怎么也调不通! 下面就来探究到底是怎么回事 项目中使用 来进行 请求,使用 请求传参的基本姿势: 如果想要将参数放在 中,应该怎么做呢? 查看 的文档并没有看到对应说明,去github上翻看下 看看 在 文件中 可以看到像 、 、 、 方法,它们只接收...
WebStorm安装和破解(全网最快捷、最靠谱的方法
一、下载与安装 1.下载 官方地址: 2.安装 二、启动与激活 1.启动 2.激活 激活网站: 1.打开网址 选择带图表和星星的点进去。 2.下载工具软件 下载后,解压,打开文件。 进入到scripts 文件夹中 windows系统双击:install current user.vbs mac 系统双击:install.sh 双击后,然后耐心等待10 20秒,会出现一个弹窗done。 3.返回网址 去复制激活码 变成cop...
Editor.js 开发 Notion 风格富文本编辑器
前言 开发一个编辑博客内容的富文本编辑器,风格类似于 Notion 块级的编辑器,研究了 开源项目,和它的风格接近,editorjs 界面简洁,操作个人感觉很高级,插件灵活易扩展,样式可编辑修改,开发成本也没有那么复杂 介绍 Editor.js 亮点 用户界面友好 :Editor.js 提供了一个直观且易于使用的用户界面,能够轻松地创建和编辑文档 模块化编辑 : 使用块级元素(blocks)的方式组织文本,每个块负责处理不同类型的内容,...
React父组件刷新导致子组件重新渲染问题
React更新原理分析 要想知道这个问题的原因,我们得知道一些 的原理,在react中在每次更新产生后都会进行一个叫做 的过程,在其中react中会找到此次更新中fiber树发生的变化,并将他们打上一些标记,在下一个阶段中在根据这些标记对该fiber节点进行一些操作,比如当一个fiber节点被打上 标记就说明待会该fiber节点对应的dom节点需要被插入dom树,理所当然的如果我们想要每次更新都能迅速的完成那么我们肯定就不能傻乎乎的去比...