Javascript 反应如何在没有警告的情况下将网格插入选项卡面板？

这个问题不言自明。我正在使用材质UI中的选项卡，以便根据用户的选择呈现不同的网格。每个面板应包含一个带有各种文本字段和组件的网格。问题是我收到一条警告说：

警告：validateDOMNesting（…）：div不能显示为p的后代

代码如下：

<Grid item md={10} xs={10} className={classes.divStyle}>
      {categories.map((category, i) => (
             <TabPanel value={value} index={i} key={`tabpanel-${i}`}>
                  <Grid p={3}>
                  </Grid>
              </TabPanel>
                ))};
</Grid>

{categories.map（（categories，i）=>(
))};

我该怎么解决呢？提前谢谢

您的代码基本上是正确的（假设您在此处没有显示TabContext、Tab、value等）

检查是否有呈现为

标记的父组件，例如使用浏览器代码检查

---

此错误的常见来源似乎是父

元素，默认情况下，该元素呈现为

标记。例如，可以通过

来更改。或者，排版元素可以更好地在树的下一层使用，即不作为父元素，但更像是使用p标记的方式。

是否在树中返回作为顶级组件的元素？如果您这样做，您可能会考虑使用空尖括号将其替换为片段

p

网格的

属性应该做什么？我看不到这个，谢谢！这正是问题所在！：D