🔍 Focus an input on LiveView mount

Notes

Do you ever want to focus an input when your LiveView page first loads?

Well, I’ve got the trick for you.

We can combine the phx-mounted lifecycle event with the JS.focus/1 helper:

<.input phx-mounted={JS.focus()} type="text"/>

Now, when we visit the page, the input is already focused, and your users can start typing immediately.

Want the latest Elixir Streams in your inbox?

    No spam. Unsubscribe any time.