Reactjs 反应挂钩：Can'；t使用map函数创建列表

我有一个作为道具传递给子组件的对象数组。在子组件中，我想映射要在列表中显示的数组。但我犯了这个错误

试图对不可重写实例进行分解的尝试无效

这是我的孩子：

const ServiceTabs = (props) => {
  const [parentProps] = props;
  return (
    <ul>
      {
          parentProps.map((content) => (
            <li key={content.id} className="active">
              <BtnButton
                btnStyle={content.btnStyle}
                btnColor={content.btnColor}
                customTitle={content.customTitle}
                IconSRC={content.IconSRC}
              />
            </li>
          ))
}
    </ul>
  );
};

const servicetab=（道具）=>{
const[parentProps]=props；
返回(

{
parentProps.map（（内容）=>(


))
}

);
};

这是我的父母：

 const ServiceCategory = () => {
      const [serviceState, setserviceState] = useState([
        {
          id: 1,
          customtitle: 'hair', 
          btnStyle: {
            backgroundColor: '#fff',
            width: '100px',
            height: '100px',
            flexDirection: 'column',

          },
        },
        {
          id: 2,
          .
          .
          },        
      ]);
.
.
.
 <ServiceTabs list={serviceState} />

const servicecompose=（）=>{
常量[serviceState，setserviceState]=useState([
{
id:1，
自定义标题：“头发”，
B风格：{
背景颜色：“#fff”，
宽度：“100px”，
高度：“100px”，
flexDirection:'列'，
},
},
{
id:2，
.
.
},        
]);
.
.
.

当我将

const[parentProps]=props；

更改为

const parentProps=props；

时，错误会更改：

parentProps.map不是函数 我想我的问题是道具的解构，但我不知道怎么做。 希望我的问题很清楚

你应该使用

props.parentProps.map(content => {...})

---

正如@Clarity在评论中指出的，我通过改变

const [parentProps] = props;

到

及

到

---

将

const[parentProps]=props；

更改为

const{list:parentProps}=props；

请注意，此上下文中的[]用于分解数组，这就是它显示错误的原因：

试图对不可重写实例进行分解的尝试无效

解构对象时，应在析构函数中传递要从源对象获取的字段。更多信息可在此处找到：

---

您应该像这样分解列表属性，然后映射到该变量：

const { list } = props
list.map(content => {...})

---

下面是一个工作代码沙盒示例，使用（大部分）您的代码来说明我的意思：

您的道具名为

list

，因此您可以访问它：

props.list.map（…

oh-oh！。谢谢你们，伙计们worked@ClarityI不知道是不是因为钩子，但当以这种方式更改我的代码时，会抛出错误。>无法读取UnfinedAbove的属性“map”如果您似乎没有正确地分解prop，它应该是：const{parentProps}=props；而不是；const[parentProps}=道具；这是不正确的，没有传递给子组件的

parentProps

prop。@Berk Elmas您弄错了。我的道具是一个对象数组。谢谢，它是这样工作的，但是eslint give error>道具验证中缺少“list”。我不想添加道具验证。您使用的是道具类型吗？当我使用这种方式时，它会抛出一个错误或>类型错误：无法读取未定义的属性“映射”请参见上面的代码沙盒链接以获取工作示例是的，该链接工作正常。您能告诉我如何修复eslint>道具验证eslint（反应/道具类型）中缺少“list.map”吗错误？`我的意思是演示如何添加propTypes和DefaultPropIs如果这有帮助的话，我将非常感谢向上投票，对于propTypes，只需添加一个

list:arrayOf（Object）

的propType，并确保

从“prop types”导入{arrayOf，Object}

将defaultProps列表值设置为[]这是被接受的答案吗？如果是，你能点击被接受的答案来帮助其他可能访问这个问题的人吗？

parentProps.map((content) => (

parentProps.list.map((content) => (

const { list } = props
list.map(content => {...})