react-navigation / react-navigation/react-navigation.github.io
typescript - type checking route params when some params are required while other are optional
Ninguém assumiu esta issue ainda.
- Linguagem predominante
- JavaScript
- Estrelas
- 324
- Forks
- 2k
- Métricas de merge de PRs
- Nenhum PR com merge em 30d
Descrição
regarding: https://reactnavigation.org/docs/typescript/#type-checking-the-navigator
it says:
Specifying undefined means that the route doesn't have params. A union type with undefined (e.g. SomeType | undefined) means that params are optional.
here it says SomeType | undefined, where it looks like its referring to a single param. but "params" is plural and seems to refer to all the route params.
however, in the above example it shows:
type RootStackParamList = {
Home: undefined;
Profile: { userId: string };
Feed: { sort: 'latest' | 'top' } | undefined;
};
this example shows that either a route takes no params, takes 1 required param or 1 optional param. but what if a route takes both required and optional params? in this case i cannot type the entire param object to be undefined
so something like this:
type RootStackParamList = {
SomeRoute: {
param1: string,
param2: string | undefined,
}
};
i tried this, however it still shows errors when not passing the optional params. so this code:
navigation.navigate('SomeRoute', {
param1: 'some string'
});
shows this error:
Argument of type '{ param1: string; }' is not assignable to parameter of type '{ param2: string | undefined; param1: string; }'.
Property 'param2' is missing in type '{ param1: string; }' but required in type '{ param2: string | undefined; param1: string; }'.ts(2345)
in my case, im setting param2 in SomeRoute with useLayoutEffect with setParams(), so i need to type it or else that shows in error.
Type '{ param2: any; }' is not assignable to type 'Partial<Readonly<{ param1: string; }>>'.
Object literal may only specify known properties, and 'param2' does not exist in type 'Partial<Readonly<{ param1: string; }>>'.ts(2322)
this error disappears when typing it like i did. but i still get the other error.
i have also tried setting the types as optional with a question mark. but this also shows an error if the screen takes no other params.
so this no longer shows an error:
type RootStackParamList = {
SomeRoute: {
param1: string;
param2?: string | undefined,
}
};
navigation.navigate('SomeRoute', {
param1: 'some string,
});
but this does:
type RootStackParamList = {
SomeRoute: {
param2?: string | undefined,
}
};
navigation.navigate('SomeRoute');
is it possible to define route params like this? where some are required while others are optional, not just the while params object?
Guia de contribuição
Nenhum guia de contribuição indexado para este repositório
Primeiros passos
- Leia a issue inteira e depois o guia de contribuição do projeto.
- Comente na issue dizendo que vai assumir — evita que duas pessoas façam o mesmo trabalho.
- Faça um fork do repositório e trabalhe em uma branch.
- Abra um pull request que referencie o número da issue.
Direção de pesquisa
Revise a página de verificação de tipos do navegador em TypeScript vinculada na issue, incluindo os exemplos de RootStackParamList e o comportamento de setParams descrito pelo relator. Esclareça como representar rotas com parâmetros obrigatórios e opcionais e atualize o exemplo ou a explicação relevante para que as chamadas de navegação documentadas correspondam aos tipos compatíveis.
Escrita pelo modelo de indexação a partir do texto da issue.
Avaliação
- Stack de tecnologia
- react-native, typescript
- Domínio
- documentation
- Tipo de issue
- Documentação
- Dificuldade
- 2/5
- Tempo estimado
- 1-3 horas
- Status de atividade
- Estagnada
- Clareza
- Razoavelmente clara
- Facilidade para iniciantes
- 38/100