JSX Attributes

use:*

编辑此页面

这些是自定义指令。从某种意义上说，这只是 ref 的语法糖，但它允许我们轻松地将多个指令附加到单个元素上。指令是具有以下签名的函数：

function directive(element: Element, accessor: () => any): void

指令函数在渲染时调用，但在添加到 DOM 之前调用。你可以在其中做任何你想做的事情，包括创建信号（signals）、效果（effects）、注册清理函数等。

const [name, setName] = createSignal("")


function model(el, value) {
  const [field, setField] = value()
  createRenderEffect(() => (el.value = field()))
  el.addEventListener("input", (e) => setField(e.target.value))
};


<input type="text" use:model={[name, setName]} />

要在 TypeScript 中注册，需要扩展 JSX 命名空间。

declare module "solid-js" {
  namespace JSX {
    interface Directives {
      model: [() => any, (v: any) => any]
    }
  }
}
报告此页面问题