Loading...
Loading...
Compare original and translation side by side
import { createStackNavigator } from "@react-navigation/stack";
const Stack = createStackNavigator();
export default function App() {
return (
<NavigationContainer>
<Stack.Navigator>
<Stack.Screen name="Home" component={HomeScreen} />
</Stack.Navigator>
</NavigationContainer>
);
}app/
_layout.tsx
index.tsx
settings.tsxapp/import { createStackNavigator } from "@react-navigation/stack";
const Stack = createStackNavigator();
export default function App() {
return (
<NavigationContainer>
<Stack.Navigator>
<Stack.Screen name="Home" component={HomeScreen} />
</Stack.Navigator>
</NavigationContainer>
);
}app/
_layout.tsx
index.tsx
settings.tsxapp/// Each screen manually defines its own layout// app/_layout.tsx
import { Stack } from "expo-router";
export default function RootLayout() {
return <Stack />;
}_layout.tsx// Each screen manually defines its own layout// app/_layout.tsx
import { Stack } from "expo-router";
export default function RootLayout() {
return <Stack />;
}_layout.tsxexpo build:ios
expo build:androideas build --platform ios
eas build --platform androidexpo buildexpo build:ios
expo build:androideas build --platform ios
eas build --platform androidexpo buildundefinedundefined
**Correct:**
```ts
// app.config.ts
import { ConfigPlugin } from "expo/config-plugins";
const withMyApiKey: ConfigPlugin<{ apiKey: string }> = (config, { apiKey }) => {
config = withInfoPlist(config, (c) => {
c.modResults["MY_API_KEY"] = apiKey;
return c;
});
return config;
};
export default {
plugins: [["withMyApiKey", { apiKey: process.env.API_KEY }]],
};
**正确写法:**
```ts
// app.config.ts
import { ConfigPlugin } from "expo/config-plugins";
const withMyApiKey: ConfigPlugin<{ apiKey: string }> = (config, { apiKey }) => {
config = withInfoPlist(config, (c) => {
c.modResults["MY_API_KEY"] = apiKey;
return c;
});
return config;
};
export default {
plugins: [["withMyApiKey", { apiKey: process.env.API_KEY }]],
};if (Platform.OS === "ios") {
return <IOSComponent />;
}
return <AndroidComponent />;MyComponent.ios.tsx
MyComponent.android.tsximport { Platform } from "react-native";
const styles = StyleSheet.create({
container: Platform.select({
ios: { paddingTop: 20 },
android: { paddingTop: 0 },
}),
});if (Platform.OS === "ios") {
return <IOSComponent />;
}
return <AndroidComponent />;MyComponent.ios.tsx
MyComponent.android.tsximport { Platform } from "react-native";
const styles = StyleSheet.create({
container: Platform.select({
ios: { paddingTop: 20 },
android: { paddingTop: 0 },
}),
});import { Image } from "react-native";
<Image source={{ uri: url }} style={styles.image} />;import { Image } from "expo-image";
<Image source={url} contentFit="cover" style={styles.image} />;import { Image } from "react-native";
<Image source={{ uri: url }} style={styles.image} />;import { Image } from "expo-image";
<Image source={url} contentFit="cover" style={styles.image} />;undefinedundefined
**Correct:**
```tsx
import * as Font from "expo-font";
await Font.loadAsync({
CustomFont: require("./assets/fonts/CustomFont.ttf"),
});
**正确写法:**
```tsx
import * as Font from "expo-font";
await Font.loadAsync({
CustomFont: require("./assets/fonts/CustomFont.ttf"),
});import AsyncStorage from "@react-native-async-storage/async-storage";
await AsyncStorage.setItem("authToken", token);import * as SecureStore from "expo-secure-store";
await SecureStore.setItemAsync("authToken", token);import AsyncStorage from "@react-native-async-storage/async-storage";
await AsyncStorage.setItem("authToken", token);import * as SecureStore from "expo-secure-store";
await SecureStore.setItemAsync("authToken", token);// Manual Firebase/APNs setup, native configurationimport * as Notifications from "expo-notifications";
const token = await Notifications.getExpoPushTokenAsync();// Manual Firebase/APNs setup, native configurationimport * as Notifications from "expo-notifications";
const token = await Notifications.getExpoPushTokenAsync();undefinedundefined
**Correct:**
```json
{
"expo": {
"name": "MyApp",
"slug": "my-app",
"plugins": ["expo-router"]
}
}
**正确写法:**
```json
{
"expo": {
"name": "MyApp",
"slug": "my-app",
"plugins": ["expo-router"]
}
}import codePush from "react-native-code-push";
export default codePush(MyApp);import * as Updates from "expo-updates";
await Updates.checkForUpdateAsync();import codePush from "react-native-code-push";
export default codePush(MyApp);import * as Updates from "expo-updates";
await Updates.checkForUpdateAsync();router.push("/profile");import { router } from "expo-router";
router.push({ pathname: "/profile/[id]", params: { id: userId } });router.push("/profile");import { router } from "expo-router";
router.push({ pathname: "/profile/[id]", params: { id: userId } });app/_layout.tsxComponent.ios.tsxComponent.android.tsxexpo config pluginsapp.jsonapp.config.tseas.jsonapp/_layout.tsxComponent.ios.tsxComponent.android.tsxapp.jsonapp.config.tsexpo config pluginseas.jsonexpo buildios/android/expo buildios/android/