mirror of
https://github.com/zhigang1992/react-navigation.git
synced 2026-01-13 22:42:25 +08:00
Compare commits
4 Commits
@react-nav
...
@react-nav
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
2477db47a0 | ||
|
|
d1210a861b | ||
|
|
c4d2a8a828 | ||
|
|
fc95d7a256 |
@@ -1,38 +1,33 @@
|
||||
import * as React from 'react';
|
||||
import { View, Platform, StyleSheet, ScrollView } from 'react-native';
|
||||
import { Button } from 'react-native-paper';
|
||||
import type { RouteProp, ParamListBase } from '@react-navigation/native';
|
||||
import type { ParamListBase } from '@react-navigation/native';
|
||||
import {
|
||||
createStackNavigator,
|
||||
StackNavigationProp,
|
||||
StackScreenProps,
|
||||
} from '@react-navigation/stack';
|
||||
import Article from '../Shared/Article';
|
||||
import Albums from '../Shared/Albums';
|
||||
import NewsFeed from '../Shared/NewsFeed';
|
||||
|
||||
type SimpleStackParams = {
|
||||
Article: { author: string };
|
||||
NewsFeed: undefined;
|
||||
Article: { author: string } | undefined;
|
||||
NewsFeed: { date: number };
|
||||
Albums: undefined;
|
||||
};
|
||||
|
||||
type SimpleStackNavigation = StackNavigationProp<SimpleStackParams>;
|
||||
|
||||
const scrollEnabled = Platform.select({ web: true, default: false });
|
||||
|
||||
const ArticleScreen = ({
|
||||
navigation,
|
||||
route,
|
||||
}: {
|
||||
navigation: SimpleStackNavigation;
|
||||
route: RouteProp<SimpleStackParams, 'Article'>;
|
||||
}) => {
|
||||
}: StackScreenProps<SimpleStackParams, 'Article'>) => {
|
||||
return (
|
||||
<ScrollView>
|
||||
<View style={styles.buttons}>
|
||||
<Button
|
||||
mode="contained"
|
||||
onPress={() => navigation.replace('NewsFeed')}
|
||||
onPress={() => navigation.replace('NewsFeed', { date: Date.now() })}
|
||||
style={styles.button}
|
||||
>
|
||||
Replace with feed
|
||||
@@ -46,7 +41,7 @@ const ArticleScreen = ({
|
||||
</Button>
|
||||
</View>
|
||||
<Article
|
||||
author={{ name: route.params.author }}
|
||||
author={{ name: route.params?.author ?? 'Unknown' }}
|
||||
scrollEnabled={scrollEnabled}
|
||||
/>
|
||||
</ScrollView>
|
||||
@@ -54,10 +49,9 @@ const ArticleScreen = ({
|
||||
};
|
||||
|
||||
const NewsFeedScreen = ({
|
||||
route,
|
||||
navigation,
|
||||
}: {
|
||||
navigation: SimpleStackNavigation;
|
||||
}) => {
|
||||
}: StackScreenProps<SimpleStackParams, 'NewsFeed'>) => {
|
||||
return (
|
||||
<ScrollView>
|
||||
<View style={styles.buttons}>
|
||||
@@ -76,16 +70,14 @@ const NewsFeedScreen = ({
|
||||
Go back
|
||||
</Button>
|
||||
</View>
|
||||
<NewsFeed scrollEnabled={scrollEnabled} />
|
||||
<NewsFeed scrollEnabled={scrollEnabled} date={route.params.date} />
|
||||
</ScrollView>
|
||||
);
|
||||
};
|
||||
|
||||
const AlbumsScreen = ({
|
||||
navigation,
|
||||
}: {
|
||||
navigation: SimpleStackNavigation;
|
||||
}) => {
|
||||
}: StackScreenProps<SimpleStackParams, 'Albums'>) => {
|
||||
return (
|
||||
<ScrollView>
|
||||
<View style={styles.buttons}>
|
||||
@@ -111,11 +103,9 @@ const AlbumsScreen = ({
|
||||
|
||||
const SimpleStack = createStackNavigator<SimpleStackParams>();
|
||||
|
||||
type Props = {
|
||||
navigation: StackNavigationProp<ParamListBase>;
|
||||
};
|
||||
|
||||
export default function SimpleStackScreen({ navigation }: Props) {
|
||||
export default function SimpleStackScreen({
|
||||
navigation,
|
||||
}: StackScreenProps<ParamListBase>) {
|
||||
navigation.setOptions({
|
||||
headerShown: false,
|
||||
});
|
||||
@@ -126,7 +116,7 @@ export default function SimpleStackScreen({ navigation }: Props) {
|
||||
name="Article"
|
||||
component={ArticleScreen}
|
||||
options={({ route }) => ({
|
||||
title: `Article by ${route.params.author}`,
|
||||
title: `Article by ${route.params?.author ?? 'Unknown'}`,
|
||||
})}
|
||||
initialParams={{ author: 'Gandalf' }}
|
||||
/>
|
||||
|
||||
@@ -18,7 +18,9 @@ import {
|
||||
} from 'react-native-paper';
|
||||
import Color from 'color';
|
||||
|
||||
type Props = Partial<ScrollViewProps>;
|
||||
type Props = Partial<ScrollViewProps> & {
|
||||
date?: number;
|
||||
};
|
||||
|
||||
const Author = () => {
|
||||
return (
|
||||
|
||||
@@ -3,6 +3,14 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
## [5.6.1](https://github.com/react-navigation/react-navigation/compare/@react-navigation/bottom-tabs@5.6.0...@react-navigation/bottom-tabs@5.6.1) (2020-06-25)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/bottom-tabs
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
# [5.6.0](https://github.com/react-navigation/react-navigation/compare/@react-navigation/bottom-tabs@5.5.2...@react-navigation/bottom-tabs@5.6.0) (2020-06-24)
|
||||
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@react-navigation/bottom-tabs",
|
||||
"description": "Bottom tab navigator following iOS design guidelines",
|
||||
"version": "5.6.0",
|
||||
"version": "5.6.1",
|
||||
"keywords": [
|
||||
"react-native-component",
|
||||
"react-component",
|
||||
@@ -41,7 +41,7 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@react-native-community/bob": "^0.15.1",
|
||||
"@react-navigation/native": "^5.6.0",
|
||||
"@react-navigation/native": "^5.6.1",
|
||||
"@types/color": "^3.0.1",
|
||||
"@types/react": "^16.9.36",
|
||||
"@types/react-native": "^0.62.7",
|
||||
|
||||
@@ -3,6 +3,14 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
## [5.1.28](https://github.com/react-navigation/react-navigation/compare/@react-navigation/compat@5.1.27...@react-navigation/compat@5.1.28) (2020-06-25)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/compat
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## [5.1.27](https://github.com/react-navigation/react-navigation/compare/@react-navigation/compat@5.1.26...@react-navigation/compat@5.1.27) (2020-06-24)
|
||||
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@react-navigation/compat",
|
||||
"description": "Compatibility layer to write navigator definitions in static configuration format",
|
||||
"version": "5.1.27",
|
||||
"version": "5.1.28",
|
||||
"license": "MIT",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
@@ -32,7 +32,7 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@react-native-community/bob": "^0.15.1",
|
||||
"@react-navigation/native": "^5.6.0",
|
||||
"@react-navigation/native": "^5.6.1",
|
||||
"@types/react": "^16.9.36",
|
||||
"react": "~16.9.0",
|
||||
"typescript": "^3.9.5"
|
||||
|
||||
@@ -3,6 +3,17 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
## [5.11.1](https://github.com/react-navigation/react-navigation/compare/@react-navigation/core@5.11.0...@react-navigation/core@5.11.1) (2020-06-25)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* fix error with type definitions. closes [#8511](https://github.com/react-navigation/react-navigation/issues/8511) ([d1210a8](https://github.com/react-navigation/react-navigation/commit/d1210a861b37201827c333a5c012c4f0ebd9bb6a))
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
# [5.11.0](https://github.com/react-navigation/react-navigation/compare/@react-navigation/core@5.10.0...@react-navigation/core@5.11.0) (2020-06-24)
|
||||
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@react-navigation/core",
|
||||
"description": "Core utilities for building navigators",
|
||||
"version": "5.11.0",
|
||||
"version": "5.11.1",
|
||||
"keywords": [
|
||||
"react",
|
||||
"react-native",
|
||||
|
||||
@@ -61,7 +61,7 @@ export type EventArg<
|
||||
preventDefault(): void;
|
||||
}
|
||||
: {}) &
|
||||
(undefined extends Data ? {} : { readonly data: Data });
|
||||
(undefined extends Data ? { readonly data?: Data } : { readonly data: Data });
|
||||
|
||||
export type EventListenerCallback<
|
||||
EventMap extends EventMapBase,
|
||||
@@ -108,7 +108,7 @@ export type EventEmitter<EventMap extends EventMapBase> = {
|
||||
? { canPreventDefault: true }
|
||||
: {}) &
|
||||
(undefined extends EventMap[EventName]['data']
|
||||
? {}
|
||||
? { data?: EventMap[EventName]['data'] }
|
||||
: { data: EventMap[EventName]['data'] })
|
||||
): EventArg<
|
||||
EventName,
|
||||
@@ -276,7 +276,12 @@ export type RouteProp<
|
||||
RouteName extends keyof ParamList
|
||||
> = Omit<Route<Extract<RouteName, string>>, 'params'> &
|
||||
(undefined extends ParamList[RouteName]
|
||||
? {}
|
||||
? {
|
||||
/**
|
||||
* Params for this route
|
||||
*/
|
||||
params?: ParamList[RouteName];
|
||||
}
|
||||
: {
|
||||
/**
|
||||
* Params for this route
|
||||
|
||||
@@ -3,6 +3,14 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
## [5.1.1](https://github.com/react-navigation/react-navigation/compare/@react-navigation/devtools@5.1.0...@react-navigation/devtools@5.1.1) (2020-06-25)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/devtools
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
# 5.1.0 (2020-06-24)
|
||||
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@react-navigation/devtools",
|
||||
"description": "Developer tools for React Navigation",
|
||||
"version": "5.1.0",
|
||||
"version": "5.1.1",
|
||||
"keywords": [
|
||||
"react",
|
||||
"react-native",
|
||||
@@ -36,7 +36,7 @@
|
||||
"clean": "del lib"
|
||||
},
|
||||
"dependencies": {
|
||||
"@react-navigation/core": "^5.11.0",
|
||||
"@react-navigation/core": "^5.11.1",
|
||||
"deep-equal": "^2.0.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
||||
@@ -3,6 +3,14 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
## [5.8.4](https://github.com/react-navigation/react-navigation/compare/@react-navigation/drawer@5.8.3...@react-navigation/drawer@5.8.4) (2020-06-25)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/drawer
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## [5.8.3](https://github.com/react-navigation/react-navigation/compare/@react-navigation/drawer@5.8.2...@react-navigation/drawer@5.8.3) (2020-06-24)
|
||||
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@react-navigation/drawer",
|
||||
"description": "Drawer navigator component with animated transitions and gesturess",
|
||||
"version": "5.8.3",
|
||||
"version": "5.8.4",
|
||||
"keywords": [
|
||||
"react-native-component",
|
||||
"react-component",
|
||||
@@ -46,7 +46,7 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@react-native-community/bob": "^0.15.1",
|
||||
"@react-navigation/native": "^5.6.0",
|
||||
"@react-navigation/native": "^5.6.1",
|
||||
"@types/react": "^16.9.36",
|
||||
"@types/react-native": "^0.62.7",
|
||||
"del-cli": "^3.0.1",
|
||||
|
||||
@@ -3,6 +3,14 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
## [5.2.12](https://github.com/react-navigation/react-navigation/compare/@react-navigation/material-bottom-tabs@5.2.11...@react-navigation/material-bottom-tabs@5.2.12) (2020-06-25)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/material-bottom-tabs
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## [5.2.11](https://github.com/react-navigation/react-navigation/compare/@react-navigation/material-bottom-tabs@5.2.10...@react-navigation/material-bottom-tabs@5.2.11) (2020-06-24)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/material-bottom-tabs
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@react-navigation/material-bottom-tabs",
|
||||
"description": "Integration for bottom navigation component from react-native-paper",
|
||||
"version": "5.2.11",
|
||||
"version": "5.2.12",
|
||||
"keywords": [
|
||||
"react-native-component",
|
||||
"react-component",
|
||||
@@ -42,7 +42,7 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@react-native-community/bob": "^0.15.1",
|
||||
"@react-navigation/native": "^5.6.0",
|
||||
"@react-navigation/native": "^5.6.1",
|
||||
"@types/react": "^16.9.36",
|
||||
"@types/react-native": "^0.62.7",
|
||||
"@types/react-native-vector-icons": "^6.4.5",
|
||||
|
||||
@@ -3,6 +3,14 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
## [5.2.12](https://github.com/react-navigation/react-navigation/compare/@react-navigation/material-top-tabs@5.2.11...@react-navigation/material-top-tabs@5.2.12) (2020-06-25)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/material-top-tabs
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## [5.2.11](https://github.com/react-navigation/react-navigation/compare/@react-navigation/material-top-tabs@5.2.10...@react-navigation/material-top-tabs@5.2.11) (2020-06-24)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/material-top-tabs
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@react-navigation/material-top-tabs",
|
||||
"description": "Integration for the animated tab view component from react-native-tab-view",
|
||||
"version": "5.2.11",
|
||||
"version": "5.2.12",
|
||||
"keywords": [
|
||||
"react-native-component",
|
||||
"react-component",
|
||||
@@ -45,7 +45,7 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@react-native-community/bob": "^0.15.1",
|
||||
"@react-navigation/native": "^5.6.0",
|
||||
"@react-navigation/native": "^5.6.1",
|
||||
"@types/react": "^16.9.36",
|
||||
"@types/react-native": "^0.62.7",
|
||||
"del-cli": "^3.0.1",
|
||||
|
||||
@@ -3,6 +3,14 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
## [5.6.1](https://github.com/react-navigation/react-navigation/compare/@react-navigation/native@5.6.0...@react-navigation/native@5.6.1) (2020-06-25)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/native
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
# [5.6.0](https://github.com/react-navigation/react-navigation/compare/@react-navigation/native@5.5.1...@react-navigation/native@5.6.0) (2020-06-24)
|
||||
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@react-navigation/native",
|
||||
"description": "React Native integration for React Navigation",
|
||||
"version": "5.6.0",
|
||||
"version": "5.6.1",
|
||||
"keywords": [
|
||||
"react-native",
|
||||
"react-navigation",
|
||||
@@ -37,7 +37,7 @@
|
||||
"clean": "del lib"
|
||||
},
|
||||
"dependencies": {
|
||||
"@react-navigation/core": "^5.11.0",
|
||||
"@react-navigation/core": "^5.11.1",
|
||||
"nanoid": "^3.1.9"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
||||
@@ -3,6 +3,25 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
## [5.6.2](https://github.com/react-navigation/react-navigation/compare/@react-navigation/stack@5.6.1...@react-navigation/stack@5.6.2) (2020-06-25)
|
||||
|
||||
**Note:** Version bump only for package @react-navigation/stack
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## [5.6.1](https://github.com/react-navigation/react-navigation/compare/@react-navigation/stack@5.6.0...@react-navigation/stack@5.6.1) (2020-06-25)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* fix showing back button with headerMode=screen. fixes [#8508](https://github.com/react-navigation/react-navigation/issues/8508) ([fc95d7a](https://github.com/react-navigation/react-navigation/commit/fc95d7a256846b6a4fa999fbbe3fed2051972b42))
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
# [5.6.0](https://github.com/react-navigation/react-navigation/compare/@react-navigation/stack@5.5.1...@react-navigation/stack@5.6.0) (2020-06-24)
|
||||
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@react-navigation/stack",
|
||||
"description": "Stack navigator component for iOS and Android with animated transitions and gestures",
|
||||
"version": "5.6.0",
|
||||
"version": "5.6.2",
|
||||
"keywords": [
|
||||
"react-native-component",
|
||||
"react-component",
|
||||
@@ -46,7 +46,7 @@
|
||||
"devDependencies": {
|
||||
"@react-native-community/bob": "^0.15.1",
|
||||
"@react-native-community/masked-view": "^0.1.10",
|
||||
"@react-navigation/native": "^5.6.0",
|
||||
"@react-navigation/native": "^5.6.1",
|
||||
"@types/color": "^3.0.1",
|
||||
"@types/react": "^16.9.36",
|
||||
"@types/react-native": "^0.62.7",
|
||||
|
||||
@@ -32,7 +32,6 @@ export type Props = {
|
||||
scenes: (Scene<Route<string>> | undefined)[];
|
||||
getPreviousScene: (props: {
|
||||
route: Route<string>;
|
||||
index: number;
|
||||
}) => Scene<Route<string>> | undefined;
|
||||
getFocusedRoute: () => Route<string>;
|
||||
onContentHeightChange?: (props: {
|
||||
@@ -79,10 +78,7 @@ export default function HeaderContainer({
|
||||
|
||||
const isFocused = focusedRoute.key === scene.route.key;
|
||||
const previous =
|
||||
getPreviousScene({
|
||||
route: scene.route,
|
||||
index: i,
|
||||
}) ?? parentPreviousScene;
|
||||
getPreviousScene({ route: scene.route }) ?? parentPreviousScene;
|
||||
|
||||
// If the screen is next to a headerless screen, we need to make the header appear static
|
||||
// This makes the header look like it's moving with the screen
|
||||
|
||||
@@ -32,7 +32,6 @@ type Props = TransitionPreset & {
|
||||
cardStyle?: StyleProp<ViewStyle>;
|
||||
getPreviousScene: (props: {
|
||||
route: Route<string>;
|
||||
index: number;
|
||||
}) => Scene<Route<string>> | undefined;
|
||||
getFocusedRoute: () => Route<string>;
|
||||
renderHeader: (props: HeaderContainerProps) => React.ReactNode;
|
||||
@@ -162,7 +161,7 @@ function CardContainer({
|
||||
|
||||
const isParentHeaderShown = React.useContext(HeaderShownContext);
|
||||
const isCurrentHeaderShown = headerMode !== 'none' && headerShown !== false;
|
||||
const previousScene = getPreviousScene({ route: scene.route, index });
|
||||
const previousScene = getPreviousScene({ route: scene.route });
|
||||
|
||||
return (
|
||||
<Card
|
||||
|
||||
@@ -336,31 +336,21 @@ export default class CardStack extends React.Component<Props, State> {
|
||||
return state.routes[state.index];
|
||||
};
|
||||
|
||||
private getPreviousScene = ({
|
||||
route,
|
||||
index,
|
||||
}: {
|
||||
route: Route<string>;
|
||||
index: number;
|
||||
}) => {
|
||||
const previousRoute = this.props.getPreviousRoute({ route });
|
||||
private getPreviousScene = ({ route }: { route: Route<string> }) => {
|
||||
const { getPreviousRoute } = this.props;
|
||||
const { scenes } = this.state;
|
||||
|
||||
let previous: Scene<Route<string>> | undefined;
|
||||
const previousRoute = getPreviousRoute({ route });
|
||||
|
||||
if (previousRoute) {
|
||||
// The previous scene will be shortly before the current scene in the array
|
||||
// So loop back from current index to avoid looping over the full array
|
||||
for (let j = index - 1; j >= 0; j--) {
|
||||
const s = this.state.scenes[j];
|
||||
const previousScene = scenes.find(
|
||||
(scene) => scene.route.key === previousRoute.key
|
||||
);
|
||||
|
||||
if (s && s.route.key === previousRoute.key) {
|
||||
previous = s;
|
||||
break;
|
||||
}
|
||||
}
|
||||
return previousScene;
|
||||
}
|
||||
|
||||
return previous;
|
||||
return undefined;
|
||||
};
|
||||
|
||||
render() {
|
||||
|
||||
Reference in New Issue
Block a user