Show HN: Web-directive.js – A directive pattern for native HTML
4 months ago
- #javascript
- #html-directives
- #web-development
- WebDirective 是一个用于在原生HTML中实现指令模式的库，无需框架，灵感来自Vue.js。
- 它允许开发者通过添加属性将JavaScript行为注入HTML元素，类似于Vue指令。
- 传统方法（如直接绑定事件或使用委托事件监听器）存在内存泄漏或复杂性等缺陷。
- Web Components提供了另一种解决方案，但存在开发门槛较高和CSS管理问题。
- WebDirective提供了一种非侵入式、无副作用的HTML元素扩展方式，可跨环境和框架工作。
- 支持事件监听、单例实例和动态更新，并提供mounted、unmounted、updated等生命周期钩子。
- 可通过npm、yarn或CDN安装，同时支持UMD和ES模块格式。
- 内置工具函数如自动清理事件的useEventListener和等待更新的nextTick。
- 为指令生命周期阶段触发自定义事件，并支持可配置前缀以避免冲突。
- 通过enableAttrParams和enableChildrenUpdated等选项支持参数传递、修饰符等高级功能。