Почему получаю ошибку TypeError: Object is not a function?

Есть контекст и из него пытаюсь передать функцию patientsHasChanged

import React, { useState } from 'react';
import {createContext} from 'react';
import PatientService from './components/services/PatientService';

const PatientContext = createContext([]);

export function PatientInfoProvider({children}) {
    const [patients, setPatients] = useState(['TEST']);

    const patientsHasChanged = () => {
        PatientService.getPatients(setPatients);
    }

    return (
        <PatientContext.Provider value={patients, patientsHasChanged}>
            {children}
        </PatientContext.Provider>
    );
}

export default PatientContext;

Компонент в который пытаюсь передать эту функцию:

import React, { useContext, useState } from 'react';
import { useHistory } from 'react-router';
import PatientContext from '../PatientContext';
import PatientService from './services/PatientService';

const NewPatient = () => {
   const [patientsHasChanged] = useContext(PatientContext); //На эту строку ругается компилятор

    const [patient, setPatient] = useState({});
    const history = useHistory();

    const savePatient = async () => {
        PatientService.savePatient(patient).then(p => {
           patientsHasChanged();
            history.push(`/TechTask${p.id}`);
        });
    }

    const cancelInfo = () => {
        history.push(`/TechTask`);
    }

    return (
        <div>
            // Some code here
        </div>
    );
}

export default NewPatient;

И как результат получаю ошибку: введите сюда описание изображения

Почему это так работает и как исправить? Буду благордарен любому совету


Ответы (0 шт):