Javascript 如何为对象数组设置redux初始状态？

我正在为我的react应用程序使用redux。我正在从api获取用户数据，用它更新redux状态，并将其显示到我的组件中。数据是对象列表。导致我出现问题的是设置redux初始状态

减速器初始状态：

const initState = {
    users: []
}

减速器作用

case 'GET_USERS':
    return {
        users: action.users
    }
});

在组件中渲染

{this.props.users[1].name}

在第一次渲染时，我收到一个错误，无法从未定义的属性读取。这是因为在第一次渲染时，数据尚未存储，并且具有该属性的对象还不存在。如果我将初始状态设置为：

const initState = {
    users: [
        {name: "", age: ""},
        {name: "", age: ""}
    ]
}

---

在这种情况下，将存在具有属性的对象，并且不会出现错误。但我不知道我将拥有多少个对象，我不想为每个对象及其属性设置初始状态。那么，如何正确设置它呢？

只需检查它是否存在并有条件地渲染即可

{this.props.users.length > 1 ? this.props.users[1].name : 'Not enough elements!'}

---

只需检查它是否存在，并有条件地进行渲染

{this.props.users.length > 1 ? this.props.users[1].name : 'Not enough elements!'}

---

在渲染之前，我将使用空数组并检查[].length属性

在渲染之前，我将使用空数组并检查[].length属性

您不应该像这样通过用户的位置来呈现用户。您要么迭代所有用户，要么考虑规范化数据

<div>
  {users.map(user) => (
    <div>{users.name}</div>
  )}
</div>

{users.map（user）=>(
{users.name}
)}

---

您不应该通过用户的位置呈现这样的用户。您要么迭代所有用户，要么考虑规范化数据

<div>
  {users.map(user) => (
    <div>{users.name}</div>
  )}
</div>

{users.map（user）=>(
{users.name}
)}

---

您提到了对象结构

{name: "", age: ""}

然后您提到如何访问

users.name.firstname

。如果您得到一个未定义的

，这意味着您的dara尚未加载到您的用户数组中。因此，使用空数组实例化，例如

users:[]

，并添加以下内容：

const YourComponent = (props) => {
  if (users.length === 0){
    return <div> Loading </div>
  }
  return(
    <div>
      {users.map(user => 
        <div>
          {user.name}
        </div>  
      )}
    </div>
  )
}

constyourcomponent=（道具）=>{
if（users.length==0）{
回装
}
返回(
{users.map（user=>
{user.name}
)}
)
}

---

组件将在填充数组之前加载并返回加载div。填充数组时，组件将重新加载并映射出数组。

您提到了对象结构

{name: "", age: ""}

然后您提到如何访问

users.name.firstname

。如果您得到一个未定义的

，这意味着您的dara尚未加载到您的用户数组中。因此，使用空数组实例化，例如

users:[]

，并添加以下内容：

const YourComponent = (props) => {
  if (users.length === 0){
    return <div> Loading </div>
  }
  return(
    <div>
      {users.map(user => 
        <div>
          {user.name}
        </div>  
      )}
    </div>
  )
}

constyourcomponent=（道具）=>{
if（users.length==0）{
回装
}
返回(
{users.map（user=>
{user.name}
)}
)
}

---

组件将在填充数组之前加载，并返回加载div。填充数组时，组件将重新渲染并映射出数组。

例如，您需要使用映射迭代数组，并在映射中渲染项目。在这种情况下，如果数组为空，则不会进行渲染。我认为您应该扩展渲染方法，以完全显示您试图输出的内容。例如，您需要使用贴图迭代数组，并在贴图中渲染项目。在这种情况下，如果数组为空，则不会进行任何渲染。我认为您应该扩展渲染方法，以完全显示您试图输出的内容。但如果深入，则无法工作。。例如users.name.firstname，但它在深入时不起作用。。例如users.name.firstname我知道这种方法，但我想避免在每个组件中使用if语句，当然必须有更好的方法来实现它。这是一种常见的做法，因此除非您有特定的原因，否则您可以在所有组件中使用它。或者，检查react Loadable我知道这种方法，但我想避免在每个组件中使用if语句，当然必须有更好的方法来实现这一点。这是一种常见的做法，因此除非您有特定的原因，否则您可以在所有组件中使用它。或者，检查react loadable