我厂既然号称“机器编程”,DSL 便属于基础配置。于是,各个产品几乎都需要用到 CodeMirror,用于在线写代码。大家的屏幕分辨率不同,对编辑器的大小要求也不同,最简单的办法就是让大家自己调整,并且将尺寸保存在本地。
以前的做法会复杂一些:
- 拿一个元素作为 handle 放在角落里
- mousedown 时开始侦听 mousemove,动态调整文本框大小
- mouseup 时保存尺寸
如今大家应该都有注意到,<textarea>
右下角多了一个缩放用的 handle。这个功能自然不是 <textarea>
独享,而是受 CSS 样式 resize
控制,任何块级元素都适用。MDN 文档在此,建议大家先好好看一遍。