Untitled

 avatar
unknown
plain_text
2 years ago
760 B
7
Indexable
class ItemList extends React.Component {
  state = {
    items: []
  };

  componentDidMount() {
    const { items } = this.props;
    this.setState({ items });

    items.forEach((item, index) => {
      setTimeout(() => {
        this.setState(state => {
          return {
            items: [
              ...state.items.slice(0, index),
              { ...item, isVisible: true },
              ...state.items.slice(index + 1)
            ]
          };
        });
      }, index * 1000);
    });
  }

  render() {
    return (
      <ul>
        {this.state.items.map(item => {
          return item.isVisible ? (
            <li key={item.id}>{item.name}</li>
          ) : null;
        })}
      </ul>
    );
  }
}
Editor is loading...