Откуда берется объект, если я передал в контексте масив?
У меня есть пока-что пустой масив в главном компоненте, который я передаю, как контекст, в дочерние компоненты:
const PatientContext = createContext([{}]);
function App() {
const [selectedPatient, setSelectedPatient] = useState([]);
const [patients, setPatients] = useState([]);
async function patientsHasChanged() {
const patientService = new PatientService();
const loadedPatients = await patientService.getPatients();
setPatients(loadedPatients);
};
return (
<div className='app'>
<PatientContext.Provider value={[selectedPatient, setSelectedPatient, patients, patientsHasChanged]}>
<Sidebar />
<Content />
</PatientContext.Provider>
</div>
);
}
И в дочернем компоненте я пытаюсь с этим масивом работать:
const Sidebar = () => {
const [patients, selectedPatient, setSelectedPatient] = useContext(PatientContext);
return (
<div className='sidebar'>
<div className='search'>
<input type="text" placeholder='Search' />
<a href="/TechTask/new"><button>New patient</button></a>
</div>
<div className='list'>
<ul>
{patients.map((p) =>
<li onClick={setSelectedPatient}>
<div className='name'>
{p.name}
</div>
<div className='age'>
{p.age}
</div>
</li>)
}
</ul>
</div>
</div>
);
};
Но получаю ошибку
TypeError: patients.map is not a function
Обычно, такая ошибка у меня появляется, когда я пытаюсь использовать map для не масивов, но тут то я явно пытаюсь передать масив, как контекст. Я решил посмотреть через console.log(patients) что там на самом деле хранится и увидел там объект {}. Вопрос: откуда он берется и как это исправить, т.к это не должно так работать?