mirror of
https://github.com/zhigang1992/react-navigation.git
synced 2026-05-26 15:07:19 +08:00
chore: add an example for SSR (#8298)
<img width="740" alt="Screen Shot 2020-05-20 at 16 31 30" src="https://user-images.githubusercontent.com/1174278/82458770-673d8880-9ab7-11ea-81d3-8ac0c1e52705.png">
This commit is contained in:
11
example/src/Restart.native.tsx
Normal file
11
example/src/Restart.native.tsx
Normal file
@@ -0,0 +1,11 @@
|
||||
import RNRestart from 'react-native-restart';
|
||||
import { Updates } from 'expo';
|
||||
|
||||
export function restartApp() {
|
||||
// @ts-ignore
|
||||
if (global.Expo) {
|
||||
Updates.reloadFromCache();
|
||||
} else {
|
||||
RNRestart.Restart();
|
||||
}
|
||||
}
|
||||
1
example/src/Restart.tsx
Normal file
1
example/src/Restart.tsx
Normal file
@@ -0,0 +1 @@
|
||||
export function restartApp() {}
|
||||
@@ -1,7 +1,7 @@
|
||||
import * as React from 'react';
|
||||
import { View, ScrollView, StyleSheet, Platform } from 'react-native';
|
||||
import { Button } from 'react-native-paper';
|
||||
import { MaterialCommunityIcons } from '@expo/vector-icons';
|
||||
import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
|
||||
import {
|
||||
createBottomTabNavigator,
|
||||
BottomTabNavigationProp,
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import * as React from 'react';
|
||||
import { View, StyleSheet } from 'react-native';
|
||||
import { Title, Button } from 'react-native-paper';
|
||||
import { Feather } from '@expo/vector-icons';
|
||||
import Feather from 'react-native-vector-icons/Feather';
|
||||
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
|
||||
|
||||
type BottomTabParams = {
|
||||
|
||||
@@ -1,8 +1,7 @@
|
||||
import * as React from 'react';
|
||||
import { View, StyleSheet, ScrollView, Alert, Platform } from 'react-native';
|
||||
import { Button, Appbar } from 'react-native-paper';
|
||||
import { BlurView } from 'expo-blur';
|
||||
import { MaterialCommunityIcons } from '@expo/vector-icons';
|
||||
import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
|
||||
import { RouteProp, ParamListBase } from '@react-navigation/native';
|
||||
import {
|
||||
createStackNavigator,
|
||||
@@ -10,6 +9,7 @@ import {
|
||||
HeaderBackground,
|
||||
useHeaderHeight,
|
||||
} from '@react-navigation/stack';
|
||||
import BlurView from '../Shared/BlurView';
|
||||
import Article from '../Shared/Article';
|
||||
import Albums from '../Shared/Albums';
|
||||
|
||||
|
||||
3
example/src/Shared/BlurView.native.tsx
Normal file
3
example/src/Shared/BlurView.native.tsx
Normal file
@@ -0,0 +1,3 @@
|
||||
import { BlurView } from 'expo-blur';
|
||||
|
||||
export default BlurView;
|
||||
12
example/src/Shared/BlurView.tsx
Normal file
12
example/src/Shared/BlurView.tsx
Normal file
@@ -0,0 +1,12 @@
|
||||
import * as React from 'react';
|
||||
import { View, ViewProps } from 'react-native';
|
||||
|
||||
type Props = ViewProps & {
|
||||
tint: 'light' | 'dark';
|
||||
intensity: number;
|
||||
};
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
export default function BlurView({ tint, intensity, ...rest }: Props) {
|
||||
return <View {...rest} />;
|
||||
}
|
||||
@@ -11,10 +11,7 @@ import {
|
||||
} from 'react-native';
|
||||
// eslint-disable-next-line import/no-unresolved
|
||||
import { enableScreens } from 'react-native-screens';
|
||||
import RNRestart from 'react-native-restart';
|
||||
import { Updates } from 'expo';
|
||||
import { Asset } from 'expo-asset';
|
||||
import { MaterialIcons } from '@expo/vector-icons';
|
||||
import MaterialIcons from 'react-native-vector-icons/MaterialIcons';
|
||||
import {
|
||||
Provider as PaperProvider,
|
||||
DefaultTheme as PaperLightTheme,
|
||||
@@ -36,11 +33,11 @@ import {
|
||||
} from '@react-navigation/drawer';
|
||||
import {
|
||||
createStackNavigator,
|
||||
Assets as StackAssets,
|
||||
StackNavigationProp,
|
||||
HeaderStyleInterpolators,
|
||||
} from '@react-navigation/stack';
|
||||
|
||||
import { restartApp } from './Restart';
|
||||
import AsyncStorage from './AsyncStorage';
|
||||
import LinkingPrefixes from './LinkingPrefixes';
|
||||
import SettingsItem from './Shared/SettingsItem';
|
||||
@@ -126,12 +123,10 @@ const Stack = createStackNavigator<RootStackParamList>();
|
||||
const NAVIGATION_PERSISTENCE_KEY = 'NAVIGATION_STATE';
|
||||
const THEME_PERSISTENCE_KEY = 'THEME_TYPE';
|
||||
|
||||
Asset.loadAsync(StackAssets);
|
||||
|
||||
export default function App() {
|
||||
const [theme, setTheme] = React.useState(DefaultTheme);
|
||||
|
||||
const [isReady, setIsReady] = React.useState(false);
|
||||
const [isReady, setIsReady] = React.useState(Platform.OS === 'web');
|
||||
const [initialState, setInitialState] = React.useState<
|
||||
InitialState | undefined
|
||||
>();
|
||||
@@ -307,12 +302,7 @@ export default function App() {
|
||||
value={I18nManager.isRTL}
|
||||
onValueChange={() => {
|
||||
I18nManager.forceRTL(!I18nManager.isRTL);
|
||||
// @ts-ignore
|
||||
if (global.Expo) {
|
||||
Updates.reloadFromCache();
|
||||
} else {
|
||||
RNRestart.Restart();
|
||||
}
|
||||
restartApp();
|
||||
}}
|
||||
/>
|
||||
<Divider />
|
||||
|
||||
Reference in New Issue
Block a user