smalljs$mol搜索⌘ K文档演练场对比生态系统关于ZH
介绍Getting Started介绍心智模型快速上手从 TypeScript 到 view.tree项目结构工具链Essentials安装视图状态与响应式路由渲染测试部署故障排查Data数据获取数据模式Giper BazaMore展示来自 React、Vue 和 Svelte食谱Advanced插件模块元数据离线幽灵视图About常见问题团队发布API$mol_button_major$mol_button_minor$mol_string$mol_number$mol_text$mol_paragraph$mol_list$mol_row$mol_link$mol_check$mol_switch$mol_select$mol_scroll$mol_page$mol_pick

介绍

从 React 或 Vue 过来，觉得哪儿都对不上？先读 心智模型：五分钟说清 computed、watch、生命周期钩子和数据加载都去哪儿了。

什么是 $mol？

$mol 是一个响应式 UI 框架：你描述界面是什么，框架来决定如何以及何时更新它。没有虚拟 DOM，没有手动订阅，没有 useEffect。你把组件写成一棵树；$mol 只渲染可见的部分，只重新计算真正发生变化的部分。一个组件由三个文件组成：name.view.tree — 声明式布局（一种紧凑的树形语言）name.view.ts — 行为逻辑（纯 TypeScript 类）name.view.css.ts — 带类型的样式（由编译器检查）这种分离正是核心思想：布局保持可读，逻辑保持可测，样式保持类型安全。这三个文件没有哪一个是单独必需的。树只是结构的一种简写，那结构你也可以手写： 从 TypeScript 到 view.tree 把同一个组件用两种方式各写一遍，并展示树最终编译成的代码。

它适合谁？

你想要一个小巧的应用，并且随着它成长依然保持小巧——运行时很紧凑，渲染默认虚拟化。你喜欢处处皆类型——连样式都由 TypeScript 检查。你厌倦了手工接线响应式——$mol 中的状态像电子表格一样自动响应。

尝个鲜

一个完整的计数器：1$my_counter $mol_view2 sub /3 <= Count $mol_view4 sub / <= count \5 <= Increment $mol_button6 click? <=> increment?7 sub / <= label \+1namespace $.$$ {2 export class $my_counter extends $.$my_counter {3 @ $mol_mem count() { return 0 }4 @ $mol_action increment() { this.count( this.count() + 1 ) }5 }6}count 是响应式的：任何读取它的地方都会在它变化时自动重新渲染。没有 setState，没有依赖数组，也没有需要注册的 store。

接下来去哪？

想在自己的机器上跑起来吗？前往 快速上手，在十五分钟内构建一个可运行的应用。在 GitHub 上编辑此页这有帮助吗？是否下一页心智模型本页内容什么是 $mol？它适合谁？尝个鲜接下来去哪？
Type to search the documentation.