Using container element the right way about react-virtual-list HOT 9 CLOSED

Hmm, nothing obvious comes to mind. Would you be able to post the relevant code, and also your exact version of React? I'd love to take a closer look.

from react-virtual-list.

@CAYdenberg Do you happen to have any more info around this?

from react-virtual-list.

We've worked around and aren't using refs. I will close this for now and let you know if I come across it again.

from react-virtual-list.

Thanks @CAYdenberg - I'm going to come up with another demo implementation just to be sure things are working properly.

from react-virtual-list.

Hey @CAYdenberg - may I ask how did you solve this issue?

@developerdizzle - will you have time to add another demo with a default container (on load)?

from react-virtual-list.

Like we aren't using refs currently. IIRC, we needed it to set the scrollbar, but we worked around by just using window scroll and reworking some other element positioning.

If I circle back to this at some point I'll be sure to update this.

from react-virtual-list.

+1 to this issue, even it's closed

from react-virtual-list.

I spent a lot of time to get this working correctly but I couldn't unfortunately
the only thing I could think of (couldn't get it to work though) is to use a closure to only initialize the list once and call it from the render method (after the refs has been updated)

and everytime you call the this method again it will return a reference to the initalized list

from react-virtual-list.

I slept on it and found a solution,

I initialized the list in ComponentDidMount where you have access to the refs
And saved the list in the state

  componentDidMount() {
    this.setState({
      VList: VirtualList({
        container: this.refs.usersContainerRef,
      })(this.listOptions),
    });
  }

and in the render method I used the initialized component:

<this.state.VList items={} itemHeight={} />

and it worked!

from react-virtual-list.