New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
How to properly use inputRef
with TypeScript?
#163
Comments
With SolidJS you only can use the <TextField inputRef={element => setTimeout(() => element.focus())} /> or import createRef from "@suid/system/createRef";
let element: HTMLInputElement
onMount(() => element.focus());
<TextField inputRef={e => element = e} /> or import createRef from "@suid/system/createRef";
const element = createRef();
onMount(() => element.ref.focus());
<TextField inputRef={element} /> The |
During my testing, not consistently. If I refreshed the page it would focus but if I navigated to the page (via solid router's I've https://stackblitz.com/edit/angular-lzcp1h-yvbam4?file=src/Home.tsx Also, thank you so much for the I think this issue can be closed now since it was originally about Edit: Just tested it again locally and the same behavior applies. |
The code also fails with a native input element ( https://stackblitz.com/edit/angular-lzcp1h-dty8wb?file=src/Page.tsx Even so, I will track this in case a global solution could be applied. |
Hello, I've been struggling to find a way to utilize the
inputRef
parameter on TextInput components.My use-case is needing to call
.focus()
on the input field insideonMount()
(becauseautofocus
doesn't work when navigating), but the reference passed viaref
returns a<div>
, not an<input>
, which forces me to do this:(...which somehow works even though
firstChild
is a<label>
, not an<input>
)It would be great if
usernameRef?.focus()
just worked but it doesn't, so I'm left with no other choice but to use the code above.I've tried using
inputRef
in many different ways but nothing seems to work because it takes aRef<HTMLInputElement>
type which I can't do anything with and I was not able to find any documentation or examples on how to use it.The text was updated successfully, but these errors were encountered: