{ "id": "7a76c6d17cdfda02389acce1", "source": "solid:signals", "type": "github-document", "title": "on-mount", "content": "---\ntitle: onMount\norder: 5\nuse_cases: \u003e-\n initial setup, dom refs access, one-time initialization, component mounting,\n element manipulation after render\ntags:\n - lifecycle\n - mounting\n - refs\n - dom\n - initialization\nversion: '1.0'\ndescription: \u003e-\n Run code after SolidJS components mount to the DOM. Perfect for accessing\n refs, setting up third-party libraries, and one-time initializations.\n---\n\nRegisters a method that runs after initial rendering is done and the elements are mounted to the page.\nIdeal for using [refs](/reference/jsx-attributes/ref) and managing other one-time setup.\n\n```tsx\nimport { onMount } from \"solid-js\"\n\nfunction onMount(fn: () =\u003e void): void\n\n```\n\nThis is an alias for an effect that is non-tracking, meaning that it is equivalent to a [`createEffect`](/reference/basic-reactivity/create-effect) with no dependencies.\n\n```tsx\n// example that shows how to use onMount to get a reference to an element\nimport { onMount } from \"solid-js\"\n\nfunction MyComponent() {\n\tlet ref: HTMLButtonElement\n\n\t// when the component is mounted, the button will be disabled\n\tonMount(() =\u003e {\n\t\tref.disabled = true\n\t})\n\treturn \u003cbutton ref={ref}\u003eFocus me!\u003c/button\u003e\n}\n```", "url": "https://github.com/solidjs/solid-docs/blob/HEAD/src/routes/reference/lifecycle/on-mount.mdx", "metadata": { "path": "src/routes/reference/lifecycle/on-mount.mdx", "repo": "solidjs/solid-docs", "repo_url": "https://github.com/solidjs/solid-docs.git", "size": 1190, "source_type": "github" }, "hash": "317271d177b32fbe93068243e72c5aee89758dc90a6a4d8335b6523571f0d0dc", "timestamp": "2026-02-23T11:43:00.189724636+01:00" }