Блог

Главная - Вопросы по программированию - Использование типа метода обратного вызова с параметрами rest

Использование типа метода обратного вызова с параметрами rest

#javascript #reactjs #typescript #ecmascript-6 #types

Вопрос:

Родитель:

 const ParentComponent = () => {
  const childCompCallBack = (accountUrl: string, ...params: string[]) => {
    console.log(accountUrl);
    console.log(...params);
    ...
  };
 return (
  ChildComponent setAccounts={childCompCallBack}
 )
};

Ребенок:

 export type queryParams = {
  setAccounts: (accountUrl: string, ...params: string[]) => void;
}

const ChildComponent = ({ setAccounts }: queryParams) => {
  setAccounts("https://xyz/", "drafts", "2")
};

У меня возникают проблемы при попытке использовать тип queryParams в childCompCallBack аргументе. В настоящее время моя реализация работает, но я хочу избавиться от неявного объявления аргумента childCompCallBack и использовать экспортированный queryParams тип из дочернего элемента.
Любые предложения будут полезны.ty

Ответ №1:

Вы могли бы разбить типы:

 export type setAccounts = (accountUrl: string, ...params: string[]) => void

export type queryParams = {
  setAccounts : setAccounts
}

Тогда вы можете просто использовать это:

 const childCompCallBack : setAccounts = (accountUrl, ...params) => {
...

Ответ №2:

Если у вас есть доступ к queryParams родительскому файлу, вы можете просто сделать свою переменную дочернего типа:

 const ParentComponent = () => {
  const childCompCallBack: queryParams['setAccounts'] = (accountUrl, ...params) => {
    console.log(accountUrl);
    console.log(...params);
    ...
  };
 return (
  ChildComponent setAccounts={childCompCallBack}
 )
};
Метки: