In React ES6, why does the input field lose focus after typing a character?

Question

In my component below, the input field loses focus after typing a character. While using Chrome\'s Inspector, it looks like the whole form is being re-rendered instead of ju

Answer 1

Your form is rerendered when you type in a character, because you have an onChange method, which changes the state. Every state change causes the form to rerender and that is why the input method is loosing focus.

Since you are using redux, the best way would be to store the post title value in the redux object. Also, you may want to have a look at using redux-form for your form.

To get the value of the input without the re-rendering you need to use refs.