Allow fluid rendering of dynamic children

[rsquires]

No description provided.

[paulcollett]

Out of curiosity, what does the children you are passing look like to generate the falsy items that you then are filtering out?

I also wonder if React.Children.toArray would help with this?

[rsquires]

It creates an empty column. If you have a 3 column layout, and your children are something like [real element, falsy, real element], the middle column is empty. Maybe it's a false assumption, but I was hoping it would attempt to "left justify" the real children. I have not tried React.Children.toArray, will give that a go.

[paulcollett]

Sure. I think something like this would be nice for the majority of cases. I'm just a little unsure if this is a breaking change that may impact implementations already out there or something we can add - what do you think? I'm curious what is being passed as a child to create those falsy items to begin too, at least in your case?

…

On Wed, Jan 15, 2020 at 7:59 AM Ross Squires ***@***.***> wrote: ***@***.**** commented on this pull request. ------------------------------ In src/react-masonry-css.js <#47 (comment)> : > @@ -114,7 +114,7 @@ class Masonry extends React.Component { const itemsInColumns = new Array(currentColumnCount); // Force children to be handled as an array - const items = [].concat(this.props.children || []); + const items = [].concat(this.props.children || []).filter(child => child); It creates an empty column. If you have a 3 column layout, and your children are something like [real element, falsy, real element], the middle column is empty. Maybe it's a false assumption, but I was hoping it would attempt to "left justify" the real children. I have not tried React.Children.toArray, will give that a go. — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#47?email_source=notifications&email_token=AAORBBWBNMBTC6TXKH2UR63Q54XGDA5CNFSM4KGFH35KYY3PNVWWK3TUL52HS4DFWFIHK3DMKJSXC5LFON2FEZLWNFSXPKTDN5WW2ZLOORPWSZGOCR3MOVY#discussion_r366958500>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAORBBUGK6CMQMNGA53RBODQ54XGDANCNFSM4KGFH35A> .