updating the breakpointCols object doesn't update the app until i manually resize it #20
Labels
faq
Add to readme
Comments
|
it's possible to trigger a refresh manually, by using a ref on the component and calling the reCalculate function. Ideally when changing you specify new breakpoint col values we do update the layout accordingly. I'm going to look into making sure this piece works |
|
Thanks for helping!! Can you explain this manual refresh pls. Maybe with an example. Also if you need any other parts of the code I can provide them |
|
@paulcollett is referring to the Implementing the above solution would look something like that: class MyComponent extends React.Component {
constructor() {
super();
this.masonryRef = React.createRef();
}
componentDidUpdate(prevProps, prevState, snapshot) {
const masonry = this.masonryRef.current;
masonry && masonry.reCalculateColumnCount();
}
render() {
const { breakpointCols } = this.props;
return <Masonry ref={ this.masonryRef } breakpointCols={ breakpointCols } />
}
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Having a sidebar in my app I would like the columns to update with the sidebar being open or not. To do this i updated the breakpointCols object with new values but it doesn't change the app until i manually change the window size. Not sure if I'm being clear or not, but hope the images bellow help.
As you can see here the columns are displaying correctly
However when I open the sidebar the breakpoint values get updated but not the app. In this case there should be only 2 columns
The desired behaviour only occurs when i resize the windows itself
I would really appreciate if someone could help me fix this
EDIT:
here's the code: (For whatever reason I can't format it here)
I swapped the code for an image as I could not format it right
The text was updated successfully, but these errors were encountered: