单眼皮丶儿的博客

一直对开源UI组件库比较感兴趣，摸索着开发了一套，虽然还只是开始，但是从搭建到发布这套流程基本弄明白了，现在分享给大家，希望对同样感兴趣的同学有所帮助。目前我的这套名为hasaki-ui的组件库仅有两个组件，大致成果如下，后续有时间会继续完善。该项目采用的技术栈为Vite + Vue3，还使用了一些基本的Markdown知识，阅读本文档前，希望你至少对vue有些基础，那么我们正式开始。

/** * 用于实现元素拖拽 drag.ts */export default { bind(el: HTMLElement) { el.style.position = 'absolute'; // 将元素定位 let x = 0; let y = 0; let l = 0; let t = 0; let isDown = false; // 鼠标按下事件 el.onmousedown = function(e: any) {.

在Vue3中，最重要也更为人所知的就是ES6的Proxy。Proxy不仅消除了Vue2中现有的限制（比如对象新属性的增加、数组元素的直接修改不会触发响应式机制，这也是很多新手以为所谓的bug），而且有着更好的性能：我们知道，在Vue2中对数据的侦听劫持是在组件初始化时去遍历递归一个对象，给其中的每一个属性用Object.defineProperty设置它的getter和setter，然后再把处理好的这些对象挂到组件实例的this上面，所以这种方式的数据侦听是在属性层面的，这也是为什么增加对象属性无法