类型错误：无法读取未定义的属性(读取"映射") 考虑向树添加错误边界以自定义错误处理行为

Question

我一直收到这个错误：类型错误：无法读取未定义的属性(读取"map"(考虑在树中添加一个错误边界，以自定义错误处理行为

import { useState } from 'react';
import femaleProfile from './images/femaleProfile.jpg';
import maleProfile from './images/maleProfile.jpg';
const Employees = () => {
const { employees, setEmployees } = useState([{
id: 1,
fullName: "Bob Jones",
designation: "JavaScript Developer",
gender: "male",
teamName: "TeamA"
},
{
id: 2,
fullName: "Jill Bailey",
designation: "Node Developer",
gender: "female",
teamName: "TeamA"
},
{
id: 3,
fullName: "Gail Shepherd",
designation: "Java Developer",
gender: "female",
teamName: "TeamA"
},
{
id: 4,
fullName: "Sam Reynolds",
designation: "React Developer",
gender: "male",
teamName: "TeamB"
},
{
id: 5,
fullName: "David Henry",
designation: "DotNet Developer",
gender: "male",
teamName: "TeamB"
},
{
id: 6,
fullName: "Sarah Blake",
designation: "SQL Server DBA",
gender: "female",
teamName: "TeamB"
},
{
id: 7,
fullName: "James Bennet",
designation: "Angular Developer",
gender: "male",
teamName: "TeamC"
},
{
id: 8,
fullName: "Jessica Faye",
designation: "API Developer",
gender: "female",
teamName: "TeamC"
},
{
id: 9,
fullName: "Lita Stone",
designation: "C++ Developer",
gender: "female",
teamName: "TeamC"
},
{
id: 10,
fullName: "Daniel Young",
designation: "Python Developer",
gender: "male",
teamName: "TeamD"
},
{
id: 11,
fullName: "Adrian Jacobs",
designation: "Vue Developer",
gender: "male",
teamName: "TeamD"
},
{
id: 12,
fullName: "Devin Monroe",
designation: "Graphic Designer",
gender: "male",
teamName: "TeamD"
}]);

return (
<main className='container'>
<div class='row justify-content-center mt-3 mb-3'>
<div class='col-8'>
{
employees.map((employee) => (
<div id={employee.id} className='card'>
<img src={femaleProfile} className='card-img-top' />
<div className='card-body'>
<h5 className='card-title'>Full Name: {employee.fullName}</h5>
<p className='card-text'><b>Designation:</b> {employee.designation}</p>
</div>
</div>
))
}
</div>
</div>
</main >
)
}
export default Employees

我一直收到这个错误：TypeError:无法读取未定义的属性(读取"map"(考虑在树中添加一个错误边界，以自定义错误处理行为。

Answer 1

useState返回一个数组，而不是对象

使用此：

const [ employees, setEmployees ] = useState(/* */)

不是这个：

const { employees, setEmployees } = useState(/* */)