hronro hronro -4 years ago 102
React JSX Question

Why divs are flashing?

I'm new to

React Virtualized
, and sorry for my English.
This is my code pen link: http://codepen.io/anon/pen/xqGXwv?editors=0010,
when I scroll to the 4th div, it's flashing, could someone help me ?

Answer Source

You forgot to accept and set the style parameter. This parameter is very important for react-virtualized because it's what positioned the rows as you scroll down. Here's your render function, fixed:

  renderPage({index, key, style}) {
    const color = ['green', 'red', 'black', 'yellow'][index % 4]
    return (
      <div
        style={{ ...style, width: 400, height: 200, backgroundColor: color }}
        key={key}
      >
        No.{index + 1}
      </div>
    )
  }
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download