Почему реакт обновляет состояние картинок одновременно если оно у всех одинаковое?

Question

[nikmil]

Добрый вечер, подскажите пожалуйста, у меня есть 2 картинки gif - start и stop.
Их импортирую ->

import start from '../../img/start.gif';
import stop from '../../img/stop .gif';

В пропах у меня указано ->

array: [
                {name: 'user1',  animation: false},
                {name: 'user2',  animation: true}
            ],

Данная картинка у меня находится в map и чтобы они заменяли друг друга я использую ->

{this.state.array.map((e, index) => {
i = 'animation' + index
return (
<div key={i} .....
     <img src={e.animation ?  start : stop}  width="20" height="20"/>
</div>
)
})}

Картинки при измении boolean изменяются, но если будет true и true(или false и false), то обе картинки перезагрузяться одновременно, как это избежать?

Comments

[Петр Мухуров]

добавить еще одну проверку на true+true или false+false

Answer 1

[Ice]

let products = [...this.state.animation];
//ваш код
this.setState({products});

Не меняйте state напрямую