Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   delay в React .map() (https://javascript.ru/forum/dom-window/77369-delay-v-react-map.html)

NeonMan 23.04.2019 20:41

delay в React .map()
 
Может кто-то знает как установить задержку между отрисовкой элементов через .map() ?

{
  array.map((item) => {
    <div>item.title</div>
    //установить задержку между отрисовкой дивов например в 2 сек
  })
}

SuperZen 23.04.2019 21:17

Ну как варик, https://reactjs.org/docs/code-splitting.html#reactlazy, там импорт сделать по таймауту... а вообще, это надо сделать через css

SuperZen 23.04.2019 21:27

только тут надо следить и за update'ом...
import React from 'react'

export default class App extends React.Component {
  state = {
    items: [
      { id: 1 },
      { id: 2 },
      { id: 3 },
    ],
    show: 1
  }

  componentDidMount() {
    const interval = setInterval(() => {
      this.state.show === this.state.items.length
        ?
        clearInterval(interval)
        :
        this.setState({ show: this.state.show + 1 })
    }, 1000)
  }

  render() {
    return this.state.items.slice(0, this.state.show).map(item => <div key={item.id}>{item.id}</div>)
  }
}


Часовой пояс GMT +3, время: 11:58.