Имеется кусок кода на реакте. Там где звёздочки проблема. Состояние кнопки обновляется только при обновлении страницы. setState не совсем подходит, т.к. из мапы видно, что если использовать setState то приментся ко всем элементам. Какое решение может быть?
this.props.requestStore.requests.map(({id: request_id, state, book, user}) => (
<tr key={request_id}>
<td>
<input type="button"
value="Удалить"
className="request-req-inp-del"
onClick={() => this.delete(request_id)}
/>
<input type="button"
value="Одобрить"
className="request-req-inp-app"
onClick={() => this.approve(request_id)}
disabled={**!book.state**}
/>
</td>
<td>{state ? "Запрос выполнен" : "На рассмотрении"}</td>
<td>{book.title}</td>
<td>{user.username}</td>
<td>{user.bookGiven - user.bookTaken}</td>
</tr>
)
Проблема оказалась на поверхности. Дело в том, что в своем Store я не додумался менять состояние в массиве. Происходила такая ситуация: кнопка нажималась, в бд изменения шли, но в массиве, который на фронте хранится в данный момент, я не менял состояние. Решение:
changeState(identity) {
const request = this.requests.find(({id}) => id === identity);
...
for (let obj of this.requests) {
if (obj.book.id === request.book.id){
obj.book.state = false;
}
}
return request;
}
Где,
request - текущая запись (в ней расположена кнопка), на которую была нажата кнопка;
identity - id этой записи, по которой можно было быотследить;
this.requests - массив записей для прохода;
obj.book.state - все записи, которые относятся к одной книге.
Также я немного изменил вызов массива, по которому проходил.
Как развивать веб-проекты в 2026 году: технологии, контент E-E-A-T и факторы доверия
Современные инструменты для криптотрейдинга: как технологии помогают принимать решения
Апостиль в Лос-Анджелесе без лишних нервов и бумажной волокиты
Основные этапы разработки сайта для стоматологической клиники