Uncaught TypeError from map-CodePudding

This function is not working properly and is showing this error:

Uncaught TypeError: Cannot read properties of undefined (reading 'map')

{users.map((users) => {
  return (
    <div>
      <h2>Name : {users.name}</h2>
      <p>Age : {users.age}</p>
      <button onClick={() => { updateUser(users.id) }}>Ince Age</button>
      <button onClick={() => { deleteUser(users.id) }}>delete Age</button>
    </div>
  )
})}

CodePudding user response：

Add condition like this

if you are using Optional chaining (?.)

{users?.map?.((users) => {
  return (
    <div>
      <h2>Name : {users.name}</h2>
      <p>Age : {users.age}</p>
      <button onClick={() => { updateUser(users.id) }}>Ince Age</button>
      <button onClick={() => { deleteUser(users.id) }}>delete Age</button>
    </div>
  )
})}

else

{users && users.length > 0 && users.map((users) => {
  return (
    <div>
      <h2>Name : {users.name}</h2>
      <p>Age : {users.age}</p>
      <button onClick={() => { updateUser(users.id) }}>Ince Age</button>
      <button onClick={() => { deleteUser(users.id) }}>delete Age</button>
    </div>
  )
})}

CodePudding user response：

add key={users.id} inside your first div tag