This expression is not callable. Type 'EditSectorNewsCreationProps' has no call signatures. ошибка при передаче функции в компонент

Question

  const [validationType, changeValidationType] = useState(2);
  const setValidationType = (num: number) => {
    changeValidationType(num);
  };
я работаю с состояниями пытаюсь менять через дочерний компонент (
              <EditSector setValidationType={setValidationType} />
            )}

строка в компоненте, которая вызывает дочерний компонент

export const EditSector = (setValidationType: EditSectorNewsCreationProps) => {
  return (<Button
          onClick={() => setValidationType(2)}
          type='submit'
          buttonType={ButtonStyles.PLAN}
        >
          {PUBLICATION_PLAN_BUTTONS_TEXT}
        </Button>

компонент выглядит вот так внутри есть кнопка. ну и соответственно интерфейс вот такой

export interface EditSectorNewsCreationProps {
  setValidationType: (num: number) => void;
}


This expression is not callable.
  Type 'EditSectorNewsCreationProps' has no call signatures.

как исправить данную ошибку?

пытался гуглить в интернете, ничего не смог найти, ответы лишь по типу функции, но вроде я написал правильно

Answer 1

Вы говорите, что переменная setValidationType имеет следующий тип:

{
    setValidationType: (num: number) => void
}

т.е. вы пытаетесь сделать {}() - вызвать объект, как функцию, на что TS и ругается.

Вам нужен не интерфейс, а тип

export type EditSectorNewsCreationProps = (num: number) => void;

Если хотите работать с интерфейсом, то можно сделать так:

export const EditSector = (setValidationType: EditSectorNewsCreationProps['setValidationType'])

или так:

export const EditSector = ({ setValidationType }: EditSectorNewsCreationProps)

Answer 2

Ошибка в этой строке

onClick={() => setValidationType(2)}

Вы назвали объект пропсов setValidationType

export const EditSector = (setValidationType: EditSectorNewsCreationProps) => {

Так как это объект, то вы не можете его вызывать. Сначала получите нужную функцию из пропсов:

export const EditSector = (props: EditSeсtorNewsCreationProps) => {
    const { setValidationType } = props;
    // код дальше

БЛОГ НА HUSL

This expression is not callable. Type 'EditSectorNewsCreationProps' has no call signatures. ошибка при передаче функции в компонент

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