日常开发

src/components/Tab/index.tsx

@@ -0,0 +1,39 @@
+import React from 'react';
+import { StyleSheet, View, Text, TouchableOpacity } from 'react-native';
+import { useNavigation } from '@react-navigation/native';
+
+const TabScreen = () => {
+  const navigation = useNavigation();
+  const getJump = async (data) => {
+    navigation.navigate(data);
+  };
+  return (
+    <View style={styles.main}>
+      <View>
+        <TouchableOpacity onPress={() => getJump('Team')}>
+          <Text>球队</Text>
+        </TouchableOpacity>
+        <TouchableOpacity onPress={() => getJump('Data')}>
+          <Text>数据</Text>
+        </TouchableOpacity>
+        <TouchableOpacity onPress={() => getJump('Play')}>
+          <Text>PLAY</Text>
+        </TouchableOpacity>
+        <TouchableOpacity onPress={() => getJump('Match')}>
+          <Text>赛事</Text>
+        </TouchableOpacity>
+        <TouchableOpacity onPress={() => getJump('Me')}>
+          <Text>我的</Text>
+        </TouchableOpacity>
+      </View>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  main: {
+    paddingTop: 50,
+  },
+});
+
+export default TabScreen;

src/pages/Data/index.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { StyleSheet, View, Text, TouchableOpacity } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
+import TabScreen from '../../components/Tab';
 
 const DataScreen = () => {
   const navigation = useNavigation();
@@ -10,22 +11,9 @@ const DataScreen = () => {
   return (
     <View style={styles.main}>
       <View>
-        <TouchableOpacity onPress={() => getJump('Team')}>
-          <Text>球队</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Data')}>
-          <Text>数据</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Play')}>
-          <Text>PLAY</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Custom')}>
-          <Text>赛事</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Custom')}>
-          <Text>我的</Text>
-        </TouchableOpacity>
+数据
       </View>
+      <TabScreen></TabScreen>
     </View>
   );
 };

src/pages/Match/index.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { StyleSheet, View, Text, TouchableOpacity } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
+import TabScreen from '../../components/Tab';
 
 const MatchScreen = () => {
   const navigation = useNavigation();
@@ -10,22 +11,9 @@ const MatchScreen = () => {
   return (
     <View style={styles.main}>
       <View>
-        <TouchableOpacity onPress={() => getJump('Team')}>
-          <Text>球队</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Data')}>
-          <Text>数据</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Play')}>
-          <Text>PLAY</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Match')}>
-          <Text>赛事</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Me')}>
-          <Text>我的</Text>
-        </TouchableOpacity>
+ 赛事
       </View>
+      <TabScreen></TabScreen>
     </View>
   );
 };

src/pages/Me/index.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { StyleSheet, View, Text, TouchableOpacity } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
+import TabScreen from '../../components/Tab';
 
 const MeScreen = () => {
   const navigation = useNavigation();
@@ -10,22 +11,9 @@ const MeScreen = () => {
   return (
     <View style={styles.main}>
       <View>
-        <TouchableOpacity onPress={() => getJump('Team')}>
-          <Text>球队</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Data')}>
-          <Text>数据</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Play')}>
-          <Text>PLAY</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Match')}>
-          <Text>赛事</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Me')}>
-          <Text>我的</Text>
-        </TouchableOpacity>
+我的
       </View>
+      <TabScreen></TabScreen>
     </View>
   );
 };

src/pages/Play/index.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { StyleSheet, View, Text, TouchableOpacity } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
+import TabScreen from '../../components/Tab';
 
 const PlayScreen = () => {
   const navigation = useNavigation();
@@ -10,22 +11,9 @@ const PlayScreen = () => {
   return (
     <View style={styles.main}>
       <View>
-        <TouchableOpacity onPress={() => getJump('Team')}>
-          <Text>球队</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Data')}>
-          <Text>数据</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Custom')}>
-          <Text>PLAY</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Custom')}>
-          <Text>赛事</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Custom')}>
-          <Text>我的</Text>
-        </TouchableOpacity>
+Play
       </View>
+      <TabScreen></TabScreen>
     </View>
   );
 };

src/pages/Team/index.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { StyleSheet, View, Text, TouchableOpacity } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
+import TabScreen from '../../components/Tab';
 
 const TeamScreen = () => {
   const navigation = useNavigation();
@@ -10,22 +11,9 @@ const TeamScreen = () => {
   return (
     <View style={styles.main}>
       <View>
-        <TouchableOpacity onPress={() => getJump('Team')}>
-          <Text>球队</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Data')}>
-          <Text>数据</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Play')}>
-          <Text>PLAY</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Match')}>
-          <Text>赛事</Text>
-        </TouchableOpacity>
-        <TouchableOpacity onPress={() => getJump('Me')}>
-          <Text>我的</Text>
-        </TouchableOpacity>
+球队
       </View>
+      <TabScreen></TabScreen>
     </View>
   );
 };