React Hook形式状态不保存

Question

我创建了一个简单的登录表单，并使用“react-hook-form”库来维护输入控件的状态。问题是，我没有收到用户在提交时输入的数据。我正在使用第三方 UI 库“react-native-elements”作为输入控件。我按照 React Hoom Form 图书馆。

import themeStyles from "@app/ThemeStyles";
import loginStyles from "@login/LoginStyles";
import React from "react";
import { useDispatch, useSelector } from "react-redux";
import { loginstarted, loginusersuccess, loginuserfail } from "@actions/AuthActions";
import {
  SafeAreaView,
  ScrollView,
  Text,
  View
} from "react-native";
import { Input, Button } from "react-native-elements";
import { Parse } from "parse/react-native";
import { useForm, Controller } from "react-hook-form";

const { heroContainerStyle } = loginStyles;
const { h1Style, h3Style, padding10, dangerTextStyle, errorTextStyle } = themeStyles;

function LoginScreen({ navigation }) {  
  const globalState = useSelector(state => state);
  const dispatch = useDispatch();
  const loginStarted = () => dispatch(loginstarted());
  const loginUserSuccess = user => dispatch(loginusersuccess(user));
  const loginUserFail = () => dispatch(loginuserfail());

  const { control, handleSubmit, formState: { errors } } = useForm();

  const onLoginPressed = data => {console.log(data);} // LOG  {"password": "", "userName": ""}

  renderButton = () => {
    if (globalState.auth.loading) {
      return (
        <Button loading loadingProps={{ animating: true }} />
      );
    }

    return (
      <Button title="Login" onPress={handleSubmit(onLoginPressed)} />
    );
  };

  renderError = () => {
    if (globalState.auth.error) {
      return (
        <View>
          <Text style={errorTextStyle}>
            {globalState.auth.error}
          </Text>
        </View>
      );
    }
  }

  return (
    <SafeAreaView>
      <ScrollView contentInsetAdjustmentBehavior="automatic">
        <View style={[heroContainerStyle, padding10]}>
          <View style={{ flex: 0.7, flexDirection: "column" }}>
            <Text style={[h1Style, { alignSelf: "center" }]}>Logo</Text>
          </View>
          <View style={{ flex: 0.3, flexDirection: "column" }}>
            <Text style={[h3Style, { alignSelf: "center" }]}>Admin Panel</Text>
          </View>
        </View>
        <View style={[padding10]}>
          <View style={{ paddingBottom: 20 }}>
            <Controller
              name="userName"
              control={control}
              defaultValue=""
              render={({ field }) => (
                <Input {...field} />
              )}
            />
            {errors.userName && <Text style={[dangerTextStyle, padding10]}>Please enter user name</Text>}
          </View>
          <View style={{ paddingBottom: 20 }}>
            <Controller
              name="password"
              control={control}
              defaultValue=""
              render={({ onChange, value }) => (
                <Input onChange={onChange} value={value} secureTextEntry={true} />
              )}
            />
            {errors.password && <Text style={[dangerTextStyle, padding10]}>Please enter Password</Text>}
          </View>

          {renderError()}

          <View style={{ padding: 10, paddingTop: 20 }}>
            {renderButton()}
          </View>
        </View>
      </ScrollView>
    </SafeAreaView>
  );
}

export default LoginScreen

依赖项：

"@react-native-async-storage/async-storage": "^1.17.0", "@react-native-picker/picker": "^2.4.0", "@react-navigation/native": "^6.0.8", "@react-navigation/stack": "^6.1.1", "axios": "^0.26.1", "idb-keyval": "^6.1.0", "lodash": "^4.17.21", “解析”：“^3.4.0”， “反应”：“17.0.2”， "react-hook-form": "^7.28.1", “反应本机”：“0.67.4”， "react-native-calendars": "^1.1280.0", "react-native-elements": "^3.4.2", "react-native-gesture-handler": "^1.10.3", "react-native-material-textfield": "^0.16.1", "react-native-reanimated": "^2.5.0", "react-native-router-flux": "^4.3.1", "react-native-safe-area-context": "^4.2.2", "react-native-screens": "^3.13.1", "react-native-shared-element": "^0.8.4", "react-native-vector-icons": "^9.1.0", "react-navigation-shared-element": "^3.1.3", "react-redux": "^7.2.6", "reanimated-bottom-sheet": "^1.0.0-alpha.22", "redux": "^4.1.2", “redux-thunk”：“^2.4.1”