时间戳

首页 > 解决方案 > 如何在 React js 中使用数组将数组推送到对象中？

reactjs - 如何在 React js 中使用数组将数组推送到对象中？

问题描述

我有一个问题，

我有一个选择控制组件，它有选项，在选项内我通过映射数组添加选项数组staticPosts。

我的代码：

<SelectControl
    label={__("Choose Static Block Page to show above header", "pirezmeta")}
    onChange={ (value) => props.onChangeStaticContent(value) }
    options={props.staticPosts && props.staticPosts.map(post => 
        ({value: post.id, label: post.title}))}
    value={props.staticContent}
/>

一切都很好，除了我想先添加空选项，比如：{value: 0, label: "No value"} 我该怎么做，你能帮帮我吗？

标签： reactjs

解决方案

那个道具发生了很多事情。我将分别声明上面的数组 - 包括第一{value: 0, label: "No value"}项，然后添加其他映射项：

const options = [
  {value: 0, label: "No value"},
  ...props.staticPosts?.map(
    post => ({value: post.id, label: post.title})
  )
];
// ...
<SelectControl
    label={__("Choose Static Block Page to show above header", "pirezmeta")}
    onChange={ (value) => props.onChangeStaticContent(value) }
    options={props.staticPosts && options}
    value={props.staticContent}
/>

您还可以在挂载或道具更改时将组合数组置于状态。

推荐阅读