Блог

Я новичок в typescript. Я пытался решить ошибку подписи вызова, но не смог ее понять.

Я пытаюсь использовать пользовательские хуки, для которых требуется контекстный реквизит, а затем возвращаю контекст, как показано ниже

 export const useCardContext = (): ContextProps => {
  const context = useContext(CardContext);
  if (!context) {
    throw new Error(
      `Card compound components  cannot be rendered outside the Card component`
    );
  }
  return context;
};
 

и вот мои реквизиты контекста
и созданный контекст

 interface ContextProps {
  isAccordionActive: boolean;
  isModalActive: boolean;
  toggleAccordion: Function;
  toggleModal: Function;
}

const CardContext = createContext<ContextProps>({
  isAccordionActive: false,
  isModalActive: false,
  toggleAccordion: () => null,
  toggleModal: () => null,
});


 

Но когда я пытаюсь использовать перехватчики useCardContext внутри другой функции, я получаю эту ошибку.

 const data = useCardContext(); // Type 'Context<ContextProps>' has no call signatures. ts 2349
 

Итак, что я сделал, чтобы решить эту проблему, если я экспортирую CardContext и использую, как показано ниже, я не получил никакой ошибки.

 //import usecontext and CardContext
const context = useContext(CardContext); //it is fine as expected.
 

Мой вопрос в том, что я хотел бы использовать пользовательские хуки (useCardContext) без ошибки. Как я могу решить эту проблему?