CamanJS
发表于|更新于
|浏览量:
过分宽大的法律,不易使人服从;太严厉的法律,则绝少被遵守。——富兰克林
分享一个前端基于canvas的图片js库
https://github.com/meltingice/CamanJS
安装
1 | npm install caman |
用法:
1 | Caman('#my-image', function () { |
html
1 | <img |

相关推荐
2022-04-07
setState异步问题
若人间有情,那是开始,也是尽头。——北岛怀念顾城 今天使用react中setState后立马从state中获取,然后使用,发现时灵时不灵的,我立马意识到setState可能是异步的,翻看官方文档,果然: 调用 setState 其实是异步的 —— 不要指望在调用 setState 之后,this.state 会立即映射为新的值。如果你需要基于当前的 state 来计算出新的值,那你应该传递一个函数,而不是一个对象(详情见下文)。 代码不会像预期那样运行的示例: 123456789101112131415161718incrementCount() { // 注意:这样 *不会* 像预期的那样工作。 this.setState({count: this.state.count + 1});}handleSomething() { // 假设 `this.state.count` 从 0 开始。 this.incrementCount(); this.incrementCount(); this.incrementC...
2023-04-15
vueuse
多数人在心底蔑视德,但很少有人轻视荣誉。——沃夫拿格 分享一个vue的组合式api封装库vueuse github:https://github.com/vueuse/vueuse 官档:https://vueuse.org/ 大致用法: 12345678910111213141516171819202122import { useLocalStorage, useMouse, usePreferredDark } from '@vueuse/core'export default { setup() { // tracks mouse position const { x, y } = useMouse() // is user prefers dark theme const isDark = usePreferredDark() // persist state in localStorage const store = useLocalStorag...
2021-04-29
不要再问我前端如何让字符串转成Date了
生活就像一盒巧克力,你永远不知道你会得到什么。——《阿甘正传》 那天有朋友问我yyyy-MM-dd'T'HH:mm:ss.SSSZ怎么转成yyyy-MM-dd HH:mm:ss,我就给他了我这篇博客 结果他说看完还是不会。。。 那我今天再讲一次吧 首先,我们拿到一个字符串2018-05-23T16:05:52+08:00 很多程序员看到了就不知道如何下手了 我们理清思路: 1.将字符串转换成js中的Date对象 2.调用Date对象中的函数转换为我们想要的格式 我们首先调用Date的构造方法 1234var a = "2018-05-23T16:05:52+08:00"console.log(a)var date = new Date(a);console.log(date) 可以看到我们的date确实转成功了 当然,除了这种格式的日期字符串 还可以支持很多格式 以及我们的时间戳 如果这些格式都不能满足你 还有一招:按照 1new Date(年,月,日,时,分,秒,毫秒) 的格式去转换,注意月这里需要减一 同上,也支持省略写法 ...
2026-02-23
FossFLOW
眼前的瞬间是一位威力强大的女神。——歌德 FossFLOW — 用于创建华丽等轴测图的开源神器在快速变化和高度技术化的现代世界中,“以图达意”的表达变得越来越重要。FossFLOW 应运而生,为开发者、设计师和工程师带来了领先的等轴测图设计工具。 📌 FossFLOW 是什么?FossFLOW 是一个开源的渐进式 Web 应用程序(PWA),致力于帮助用户轻松创建生动的等轴测技术图解。由现代前端框架 React 打造,并使用 fork 编辑后的 Isoflow 图形库(现已作为 fossflow 发布到 NPM),无需本地安装,完全基于浏览器,无需联网即可实现离线运行。 💡 功能特性详解以下是 FossFLOW 中的一些核心功能,与其他类似工相比,它能够为用户提供极具创新性的体验: 🎨 专业级等轴测绘图:用简洁友好的方式创建 3D 风格的技术图。 💾 智能自动保存:每隔 5 秒自动保存,让您的设计过程无后顾之忧。 📱 渐进式 Web 应用支持(PWA):可在 Mac 和 Linux 上安装为原生应用。 🔒 强调用户隐私:所有数据均本地存储于用户浏览器,无需任...
2022-03-18
判断浏览器窗口滚动到最底部
任何人都应该有自尊心自信心独立性,不然就是奴才。但自尊不是轻人,自信不是自满,独立不是弧立。——徐特立 首先是昨天我们说的vue中绑定@scroll事件,别忘了加对应的高度,以及检查overflow-y: 123<div @scroll="onScroll" class="allow-scroll"> 我是很高很长很长(超过外部div高度)的内容...</div> 然后是滚动事件处理: 12345678onScroll(e) { // Y轴滚动距离 偏移高度 总高度 let { scrollTop, clientHeight, scrollHeight } = e.target console.log(`scrollTop + clientHeight ${scrollTop + clientHeight} >= scrollHeight-1 ${scrollHeight - 1}`) if (scrollTop + cl...
2023-10-27
react服务端组件
过分的赞美,对于心智是有害的。——克雷洛夫 相关博客如下: Introducing Zero-Bundle-Size React Server Components – React https://react.dev/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023#react-server-components 仓库地址: https://github.com/reactjs/server-components-demo 这是一个使用服务器组件构建的Demo应用,服务器组件是一个实验性的 React 功能。我们强烈建议在浏览此演示之前观看介绍服务器组件的演讲视频。该视频包括演示代码的流程,并重点介绍服务器组件如何工作以及它们提供的功能的关键点。 使用node18+,进入Demo 12npm install --legacy-peer-depsnpm start 此处再运行Docker,运行数据库环境 1docker-compose up 然后打开 http://localhost:...

阿超
我的名字叫阿超 年龄25岁 家在北京市 职业是软件开发 每天最晚也会在八点前回家 不抽烟 酒浅尝辄止 晚上十二点上床 保证睡足八个小时 睡前写一篇博客 再做二十分钟俯卧撑暖身 然后再睡觉 基本能熟睡到天亮 像婴儿一样不留下任何疲劳和压力 就这样迎来第二天的早晨 健康检查结果也显示我很正常 我想说明我是一个不论何时都追求内心平稳的人 不拘泥于胜负 不纠结于烦恼 不树立使我夜不能寐的敌人 这就是我在这社会的生活态度
Follow Me公告
This is my Blog