[Grid] Failed prop type: The property `xs` of `Grid` must be used on `item`

See original GitHub issue
  • This is not a v0.x issue.
  • I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior 🤔

Shouldn’t throw a warning.

Current Behavior 😯

Throws a warning when page is reloaded, complaining about xs being set on a non-item grid tag, when the line throwing the warning doesn’t have it.

Steps to Reproduce 🕹

Link:

  1. Load the page at https://codesandbox.io/s/010p1j4o0l
  2. Once it’s loaded, hit the Reload icon on the internal browser (the one on the page, displaying the results. Not your own browser)

Context 🔦

The functionality seems to be correct regardless of the warning, but I’m wondering if this could have some more serious ramifications later on. I also HATE warnings 😉

Your Environment 🌎

Tech Version
Material-UI v3.9.1
React v16.7.0
Browser Chrome 72.0
TypeScript No
etc.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:18 (7 by maintainers)

github_iconTop GitHub Comments

39reactions
oliviertassinaricommented, Feb 16, 2019

@sgermain06 You should set the item={true} property as the warning is suggesting.

7reactions
chilupacommented, Sep 9, 2020

It does give me the same warning even after doing this.

<Grid container xs={12}>
    <Grid item={true} xs={8} sm={10}></Grid>
</Grid>
Read more comments on GitHub >

github_iconTop Results From Across the Web

[Grid] Failed prop type: The property xs of Grid must be used ...
I searched my codebase, and I ensured every "Grid item" had a sm={int[1-12]} property. Still receiving error message: "index.js:1 Warning: ...
Read more >
How to fix "Failed prop type: The property `spacing` of `grid ...
spacing : Defines the space between the type item component. It can only be used on a type container component.
Read more >
How to fix "Failed prop type: The property `spacing` of `grid ...
spacing : Defines the space between the type item component. It can only be used on a type container component. Mickael Muller 190....
Read more >
Grid API - Material UI - MUI
Defines the vertical space between the type item components. It overrides the value of the spacing prop. If a number, it sets the...
Read more >
Reactjs – How to fix “Failed prop type: The property `spacing` of ...
I am currently working on a project in which I utilize React and the Material-UI framework. However, after using grid an error pops...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found