eiriklv/react-masonry-component

Destroy/rebuild

harmeetjaipur opened this issue · 2 comments

Hi, I was wondering if there is a way to destroy the components and rerender Masonry cards in any way?
P.S.: Great work with the package.

afram commented

What's your use case @harmeetjaipur?

I needed this to react to updated options, specifically horizontalOrder. I could do it by creating a ref and calling .masonry.destroy():

import React from 'react';
import Masonry from 'react-masonry-component';

export default class ImageList extends React.Component {
  constructor(props) {
    super(props);
    this.masonryRef = React.createRef();
  }

  componentDidUpdate(props) {
    this.masonryRef.current.masonry.destroy();
  }

  render() {
    return (
      <Masonry ref={this.masonryRef} options={this.masonryOptions()}>
        {this.items}
      </Masonry>
    );
  }
}

Edit: This "solution" introduced more problems than it solved, and I undid it. I'm leaving it posted, hoping that someone can improve on it.