视图

JSX 构建的是原生界面，不是 HTML。当子节点需要随状态出现、消失或重新排序时，使用 Show 和 For。

#视图如何工作

组件函数只运行一次。Solid 会更新那些读取了变化值的属性和子节点槽位。每个窗口有自己的根，窗口关闭时会被释放。

#条件内容

<Show when={expanded()} fallback={<Text>Collapsed</Text>}>
  <Text>Expanded content</Text>
</Show>

移除一个分支会释放它的副作用。兄弟内容不受影响。

#列表

<For each={items()}>{item => <Text>{item.name}</Text>}</For>

给有状态的行一个稳定标识，这样重新排序时能保留它们的状态。长集合请使用 Table 或 Tree。

#窗口生命周期

每个 Window 有独立的根。关闭一个窗口不会关闭其他窗口。处理 Dock 图标时，在 hasVisibleWindows 为 false 时打开新窗口。

#当前窗口

function Content() {
  const window = Window.getCurrentWindow();
  return <Button onClick={() => window.close()}>Close</Button>;
}

在组件初次运行时捕获窗口，或把它传入异步工作。不要稍后从未相关的回调中查找它。

#测试

quickgui check
quickgui test

examples/components-typescript 是界面画廊。examples/quick-git-typescript 是一个更大的应用，包含菜单、对话框和多个窗口。