mirror of
https://github.com/Dvorinka/Devour.git
synced 2026-06-03 20:13:03 +00:00
Tomas Dvorak
17 lines
4.4 KiB
JSON
17 lines
4.4 KiB
JSON
{
|
|
"id": "67d57c604076facd38ff7556",
|
|
"source": "solid:signals",
|
|
"type": "github-document",
|
|
"title": "create-signal",
|
|
"content": "---\ntitle: createSignal\nuse_cases: \u003e-\n state management, reactive values, component state, form inputs, counters,\n toggles, any reactive data\ntags:\n - signals\n - state\n - reactivity\n - core\n - primitives\nversion: \"1.0\"\ndescription: \u003e-\n Create reactive state with createSignal, Solid's fundamental primitive. Track\n values that change over time and automatically update your UI when they do.\n---\n\nCreates a reactive state primitive consisting of a getter (accessor) and a setter function that forms the foundation of Solid's reactivity system.\nSignals use a pull-based reactivity model where tracking subscriptions (reads) is lightweight, while updates (writes) trigger dependency tracking and effect re-execution, making them optimized for frequent reads and infrequent writes.\n\n## Import\n\n```typescript\nimport { createSignal } from \"solid-js\";\n```\n\n## Type signature\n\n```typescript\nfunction createSignal\u003cT\u003e(): Signal\u003cT | undefined\u003e;\nfunction createSignal\u003cT\u003e(value: T, options?: SignalOptions\u003cT\u003e): Signal\u003cT\u003e;\n\ntype Signal\u003cT\u003e = [get: Accessor\u003cT\u003e, set: Setter\u003cT\u003e];\n\ntype Accessor\u003cT\u003e = () =\u003e T;\n\ntype Setter\u003cT\u003e = {\n\t\u003cU extends T\u003e(value: Exclude\u003cU, Function\u003e | ((prev: T) =\u003e U)): U;\n\t\u003cU extends T\u003e(value: (prev: T) =\u003e U): U;\n\t\u003cU extends T\u003e(value: Exclude\u003cU, Function\u003e): U;\n\t\u003cU extends T\u003e(value: Exclude\u003cU, Function\u003e | ((prev: T) =\u003e U)): U;\n};\n\ninterface SignalOptions\u003cT\u003e {\n\tname?: string;\n\tequals?: false | ((prev: T, next: T) =\u003e boolean);\n\tinternal?: boolean;\n}\n```\n\n## Parameters\n\n### `value`\n\n- **Type:** `T`\n- **Default:** `undefined`\n\nThe initial value for the signal.\nIf no initial value is provided, the signal's type is automatically extended with `undefined`.\n\n### `options`\n\n- **Type:** `SignalOptions\u003cT\u003e`\n- **Default:** `undefined`\n\nConfiguration object for the signal.\n\n#### `name`\n\n- **Type:** `string`\n- **Default:** `undefined`\n\nA name for the signal used by debugging tools like [Solid devtools](https://github.com/thetarnav/solid-devtools).\nIt works only in development mode and is removed from the production bundle.\n\n#### `equals`\n\n- **Type:** `false | ((prev: T, next: T) =\u003e boolean)`\n- **Default:** `false`\n\nA custom comparison function to determine when the signal should update.\nBy default, signals use reference equality (`===`) to compare previous and next values.\nWhen set to `false`, the signal will always update regardless of value equality, which is useful for creating signals that trigger manual updates in the reactive system.\n\nWhen providing a custom function, it should be pure and return `true` if the values are equal (no update needed) or `false` if they differ (trigger update).\nImpure functions can create unexpected side effects and performance issues.\n\n#### `internal`\n\n- **Type:** `boolean`\n- **Default:** `false`\n\nMarks the signal as internal, preventing it from appearing in development tools.\nThis is primarily used by Solid's internal systems.\n\n## Return value\n\n- **Type:** `Signal\u003cT\u003e`\n\nReturns a tuple `[getter, setter]` where:\n\n- **getter**: An accessor function that returns the current value and tracks dependencies when called within a reactive context\n- **setter**: A function that updates the signal's value and notifies all dependent computations\n\n## Examples\n\n### Basic usage\n\n```tsx\nimport { createSignal } from \"solid-js\";\n\nfunction Counter() {\n\tconst [count, setCount] = createSignal(0);\n\n\treturn (\n\t\t\u003cdiv\u003e\n\t\t\t\u003cbutton onClick={() =\u003e setCount(count() + 1)}\u003e+\u003c/button\u003e\n\t\t\t\u003cspan\u003e{count()}\u003c/span\u003e\n\t\t\u003c/div\u003e\n\t);\n}\n```",
|
|
"url": "https://github.com/solidjs/solid-docs/blob/HEAD/src/routes/reference/basic-reactivity/create-signal.mdx",
|
|
"metadata": {
|
|
"path": "src/routes/reference/basic-reactivity/create-signal.mdx",
|
|
"repo": "solidjs/solid-docs",
|
|
"repo_url": "https://github.com/solidjs/solid-docs.git",
|
|
"size": 3479,
|
|
"source_type": "github"
|
|
},
|
|
"hash": "bd73d2bb8a7fe5adc347e4688c0bbeda66f20311d34f287bd549f924f1a8fb72",
|
|
"timestamp": "2026-02-23T11:43:00.188553925+01:00"
|
|
} |