He visto varias preguntas con el mismo titulo pero no el mismo problema,

Escribí un código de reacción y dentro del jsx del método de retorno, dentro de select onchange llamé a una función que establece el estado pero la página no se recargará aunque me aseguré de que el estado cambie

código jsx dentro de retorno:

<select defaultValue={book.shelf} onChange={(e) => this.handleChange(e, book)}

código dentro del constructor

 constructor(props) { super(props); this.handleChange = this.handleChange.bind(this);}

código dentro del componente

 handleChange = (e, book) => { BooksAPI.update(book, e.target.value).then(this.setState( { value: e.target.value, book: book }, () => console.log(this.state.value) ));

};

Sabiendo que this.state.value se imprime correctamente y el valor se devuelve desde la API y es diferente del valor del estado anterior

Cual podría ser el problema,

Cualquier ayuda apreciada.

Editar: mi código de selección completo

 <select defaultValue={book.shelf} onChange={(e) => handleChange(e, book)}> <option value="move" disabled> Move to... </option> <option value="currentlyReading"> Currently Reading </option> <option value="wantToRead">Want to Read</option> <option value="read">Read</option> <option value="none">None</option> </select>

Edición 2:

este es mi estado

 state = { books: [], value: '', book: {}, update: false, };

Edición final:

Para evitar confusiones, el problema estaba en mi interfaz de usuario no relacionada con este código