5

I created a form using react-final-form. autofocus is not working. The only solution I know is to use ref feature of React. Can I autofocus the input using react-final-form library?

import React from "react";
import { render } from "react-dom";
import { Form, Field } from "react-final-form";

const App = () => (
  <Form
    render={({}) => (
      <form>
        <Field name="company" component="input" autofocus />
      </form>
    )}
  />
);

render(<App />, document.getElementById("root"));
Leon Gilyadov
  • 670
  • 6
  • 13
  • Just FYI, this confused me a bit after reading your question and answer, but `autoFocus` is **not** a final-form thing. It's a React thing that works on any component that takes focus. Setting it here on `Field` just passes it through to the underlying component, which is why it works. `final-form` does not seem to deal with setting focus, probably because the details of how to do this would depend on the UI components you're actually using. I would suggest updating your question to reflect this :-) – davnicwil Aug 21 '19 at 13:41

1 Answers1

11

Using capital F, autoFocus, solved my problem.

Leon Gilyadov
  • 670
  • 6
  • 13