masonry instance is not accessible about react-masonry-component HOT 7 CLOSED

you need to bind the function you pass into ref to this

ref={function(c) {this.masonry = c.masonry}.bind(this)}

from react-masonry-component.

Despite binding the function to this there is still an error in the console. Uncaught TypeError: Cannot read property 'masonry' of null

from react-masonry-component.

I've relegated to doing something like:

<Masonry ref="masonry" ... />

And to reference in another method within the component:

componentWillReceiveProps() {
  this.refs.masonry.performLayout()
}

from react-masonry-component.

Ah, thanks @alwynsays, this worked for me

from react-masonry-component.

From React Docs:

Although string refs are not deprecated, they are considered legacy, and will likely be deprecated at some point in the future. Callback refs are preferred.

You can do it like this:

<Masonry ref={c => this.masonry = c} ... />

and

componentWillReceiveProps() {
  this.masonry.performLayout()
}

from react-masonry-component.

@ybv not sure why this isn't working for you. It's working fine for me and my code looks very similar to yours.

What versions of React/react-masonry-component/babel are you using?

from react-masonry-component.

I'm closing this issue. Please reopen if needed.

from react-masonry-component.