react-flexbox-grid icon indicating copy to clipboard operation
react-flexbox-grid copied to clipboard

Console Flooded with Unknown props 'lg', 'md', 'xs' etc. Warnings

Open efeminella opened this issue 8 years ago • 3 comments
trafficstars

It appears with version 1.1.5 Issue 45 has resurfaced in the context of a Row Component.

This regression results in the console being flooded with Warnings for Unknown props 'lg', 'md', 'xs' etc. when added to Row; though, I am unsure if such props are valid on a Row Component. That being said, these props (as well as other unknown props) should be properly filtered as as not be passed down to the underlying DOM element.

warning.js:33 Warning: Unknown prop xs on <div> tag. Remove this prop from the element. 
For details, see https://fb.me/react-unknown-prop
    in div (created by Row)
    in Row (created by CoreLayout)
    in div (created by Grid)
    in Grid (created by CoreLayout)

...

efeminella avatar Oct 05 '17 18:10 efeminella

I'm not able to reproduce this. Can you paste the code which is causing the issue?

danny-andrews avatar Oct 13 '17 17:10 danny-andrews

Sure thing, below is the code with only only the React FlexboxGrid components (for brevity):

  <Grid fluid>
    <Row>
      <Col mdOffset={3} xs={12} sm={12} md={6}>
      </Col>
    </Row>
    <Row center='xs'>
      <Col xs={12} sm={12} md={3}>
      </Col>
      <Col xs={12} sm={12} md={3}>
      </Col>
      <Col xs={12} sm={12} md={3}>
      </Col>
    </Row>
    <Row center='xs'>
      <Col sx={12}>
      </Col>
    </Row>
  </Grid>

The layout worked fine prior to upgrading and did not result in any warnings, likewise, the layout behaves as expected after upgrading; however, the console warnings remain. It appears this is the result of the props being passed down to the underlying div elements.

efeminella avatar Nov 02 '17 13:11 efeminella

@efeminella could you try with https://jacargentina.github.io/react-flexbox-grid/ please

jacargentina avatar Apr 19 '18 17:04 jacargentina