0

私はネイティブに反応するのが初めてです。2 つのフィールドを持つ単一のログイン フォームがあります。ユーザーを Dashboard.js に送信する前に認証したいと考えています。何を試しても、ボタンは何もしません(絶対に何も起こらず、エラーもありません)。コードを Login.js に保持して、実行しようとしたすべてのことを表示しました。

  1. dashboard.js へのルーティング
  2. ボタンを押したときに handleSubmitPress 関数を呼び出して何かをしようとしています。
  3. アラートをポップします。

ボタンは2つ使いました。1 つは react-native-paper から、もう 1 つは react-native から。app.js と login.js のコードを以下に示します。誰か助けてください。

コード

  App.js
    import React from "react";
    import { NavigationContainer } from "@react-navigation/native";
    import { createStackNavigator } from "@react-navigation/stack";
    import DashBoard from "./mainmenu/DashBoard";
    import Login from "./mainmenu/Login";
    
    const Stack = createStackNavigator();
    
    export default function App() {
      return (
        <NavigationContainer>
          <Stack.Navigator>
            <Stack.Screen name="Login" component={Login} />
            <Stack.Screen name="DashBoard" component={DashBoard} />
          </Stack.Navigator>
        </NavigationContainer>
      );
    }
    
    
    Login.js
    import React, { useState } from "react";
    import { Title, TextInput} from "react-native-paper";
    import { View, Alert,Button } from "react-native";
    export default function Login() {
      const [mobile, setMobile] = useState("123456789");
      const [password, setPassword] = useState("123");
    
      function handleSubmitPress() {
        console.log({ mobile, password });
      }
    
      return (
        <View
          style={{
            backgroundColor: "skyblue",
            alignItems: "center",
            justifyContent: "center",
          }}
        >
          <TextInput
            label="Your mobile number "
            value={mobile}
            onChangeText={(text) => setMobile(text)}
          />
          <TextInput
            label="Type Password  "
            value={password}
            onChangeText={(text) => setPassword(text)}
          />
    
          <Button
            icon="camera"
            type="submit"
            mode="contained"
            //onPress={() => props.navigation.navigate("DashBoard")}
            onPress={()=>Alert.alert('Navigate pressed')}
          >
            Navigate
          </Button>
    
          <Button
              title="Print"
              onPress={() => Alert.alert('Simple Button pressed')}
              // onPress={handleSubmitPress()}
            />
        </View>
      );
    }
4

1 に答える 1