Method render

src/react-list.js:491–524

()

  }

  render() {
    const { axis, getListStyle, length, type, useTranslate3d } = this.props;
    const { from, itemsPerRow } = this.state;

    const items = this.renderItems();
    if (type === 'simple') return items;

    const style = { position: 'relative' };
    const cache = {};
    const bottom = Math.ceil(length / itemsPerRow) * itemsPerRow;
    const size = this.getSpaceBefore(bottom, cache);
    if (size) {
      style[SIZE_KEYS[axis]] = size;
      if (axis === 'x') style.overflowX = 'hidden';
    }
    const offset = this.getSpaceBefore(from, cache);
    const x = axis === 'x' ? offset : 0;
    const y = axis === 'y' ? offset : 0;
    const transform = useTranslate3d
      ? `translate3d(${x}px, ${y}px, 0)`
      : `translate(${x}px, ${y}px)`;
    const listStyle = getListStyle
      ? getListStyle({ x, y })
      : {
          msTransform: transform,
          WebkitTransform: transform,
          transform
        };
    return (
      <div style={style} ref={c => (this.el = c)}>
        <div style={listStyle}>{items}</div>
      </div>
    );
  }
}