Как передать значение этому компоненту реакции

Question

У меня следующая структура кода:

const AuthUserProvider = (props: UserProviderProps, user: User) => {
  const ctx = {}; // gets some other user info from different API
  return <UserContext.Provider value={ctx} {...props} />;
};

export const UserProvider = (props: UserProviderProps) => {
  const user = {}; // gets user info from via API call
  return <AuthUserProvider {...props} />;
}

Я хочу иметь возможность передать этот объект user в компонент AuthUserProvider, но при попытке выполнить следующее:

return <AuthUserProvider {...props} user={value} />;

Я получаю эту ошибку:

TS2322: свойство 'user' не существует для типа ......

Как передать этого пользователя объект в AuthUserProvider компонент? А почему не работает вышеперечисленное?

Answer 1

Как уже упоминалось @ Yanick Bélanger

Вы просто должны добавить пользователя в определение UserProviderProps.

// Your `UserProviderProps` interface 
{
  // Existing UserProviderProps
  user: User
}

так Прототип функции будет выглядеть как

const AuthUserProvider = (props: UserProviderProps) => {};

Или, если вы не хотите трогать содержимое UserProviderProps, измените прототип функции следующим образом

const AuthUserProvider = (props: {userProvider: UserProviderProps, user: User}) => {};

Answer 2

Вы просто должны добавить user к определению UserProviderProps.