卢尔埃
@fest-lib/lure 2级反应DOM. 带子 @fest-lib/object 对应实际节点( e)E, (中文(简体) ), H, (中文(简体) ), M, (中文(简体) ), Q, (中文(简体) ), T, (中文(简体) ), C, (中文(简体) ), S),表单,叠加和拖动. 网络组件和CSS-in-JS(S)为一等.
core · dom · object · uniform
└── fest/lure ← you are here
└── icon · image · veela · fl-ui
安装
npm install @fest-lib/core @fest-lib/dom @fest-lib/object @fest-lib/uniform @fest-lib/lure
端点 : core, (中文(简体) ), dom, (中文(简体) ), object, (中文(简体) ), uniform (单位:千美元)>=0.1.0无害环境管理, sideEffects: true。 。 。 .
import { E, H, M, Q, T } from "@fest-lib/lure";
import { observe, iterated } from "@fest-lib/object";
const el = E("div", {
attributes: { id: "app" },
classList: new Set(["box"]),
style: { padding: "8px" },
on: { click: () => console.log("hi") }
}, ["Hello"]);
document.body.append(el as Node);
工厂地图
| API 密码 | 作用 |
|---|---|
E(tag | node, props, children) | 创建/ 包裹 + 绑定 |
H\页:1/汉字" )` | 解析 HTML 或标签模板 |
M(list, mapFn) | 反应列表 + 节点 |
Q(selector, root?) | 实时查询包 |
T(string | ref) | 文本节点 |
C(ref, factory) | 修改时互换节点 |
S\说到做到 | 可控样式表 |
H 前缀 : attr:* 属性 · prop:* 财产 · on:* 编号 : @* 事件 · ref 编号 : ref:* 分配.
const items = iterated(["A", "B"]);
const list = H`<ul>${M(items, (x) => H`<li>${x}</li>`)}</ul>`;
items.push("C"); // DOM updates
触发和覆盖
用这些来代替临时的听众 :
import {
withTriggerModifiers,
bindOutsideDismiss,
resolvePlacement,
registerTransientOverlay
} from "@fest-lib/lure";
- 触发设备 —— 说
once编号 :debounce编号 :prevent编号 :stop编号 :capture编号 :passive通过withTriggerModifiers财务报告和审定财务报表E({ on })tu. - 绑定外部解雇 ——由编成的路径,面板根,出逃,自能清理.
- 解析 编号 :
placeOverlay与JS的反弹. - 注册 ——同型叠接关闭LIFO.
表单 : formLink 编号 : bindForms 编号 : FormBinding (单位:千美元)bindFormControl, (中文(简体) ), formRef) (中文(简体) ). 挂载寿命周期为选入( N)bindWhileConnected) (中文(简体) ).
import { bindDraggable } from "@fest-lib/lure";
bindDraggable(target, () => console.log("drag end"));
还在包裹里
OPFS / 文件帮助者 (pickFile, (中文(简体) ), saveFile,可减值资产绑定),剪贴板,历史,滚动条,语音输入,主题/色彩引擎. 子路径 : @fest-lib/lure/markdown-assets联合来文十: jsxFactory → createElement (单位:千美元)@fest-lib/lure/src/lure/node/jsx-runtime) (中文(简体) ).
工作空间
cd modules/projects/lur.e
npm test # linker, interaction, placement, overlay-host, trigger-core, form-binding
npm run demo
npm run build
npm run publish
类型doc : npm run docs:md。许可证: 麻省理工学院。 。 。 .