Заменить изображения один раз в другой период времени - PullRequest
Новая
       5

Заменить изображения один раз в другой период времени

0 голосов
/ 02 ноября 2019

Я хочу заменить foundImg на loadingImg, для families массива. Первый через 2 секунды, затем второй через 3 ....

Этот код заменяет их одновременно 

const loadingImg = require('./assets/25.gif');
const foundImg = require('./assets/done_Icon.png');

class App  extends Component {

 state = {
    families: [
      {id:0, name: "Accident History", duration: 2000, image: loadingImg},
      {id:1, name: "Title Information", duration: 3000, image: loadingImg},
      {id:2, name: "Liens", duration: 5000, image: loadingImg}
    ],
  }

componentDidMount(){
    const newFamilies = this.state.families;
    newFamilies.map(item => { 
      item.image = foundImg;
      setTimeout(() => this.setState({families: newFamilies}),item.duration)       
    })
}

1 Ответ

0 голосов
/ 02 ноября 2019

Попробуйте этот фрагмент 

componentDidMount() {
    this.state.families.forEach(item => { 
      setTimeout(() => {
        const families = this.state.families.slice();
        const itemFound = families.filter(i => i.id === item.id)[0];
        itemFound.image = foundImg;
        this.setState({families: families})
      }, item.duration)       
    })
}

Избегайте использования карты, если вы не преобразуете массив. Вместо этого используйте foreach.

...