TouchOpacity onPress 请求不适用于 formik 和 react-native-text-input-mask

如何解决TouchOpacity onPress 请求不适用于 formik 和 react-native-text-input-mask

当我尝试登录时,按钮未发送请求。在按钮 pree 我应该控制台输出。似乎 onChangeText 和 onChange 在 TextInputMask 中无法正常工作。 TouchableOpacity 标签具有 onPress 事件,其中 onPress={()=>formikProps.handleSubmit()} 不会触发 formik 的 onSubmit 道具。 这里我使用 yup 进行验证,使用 Formik 提交数据。

    const validationSchema = yup.object().shape({
  phoneNumber: yup
    .string()
    .label("Phone Number")

    .required("Phone Number is required."),password: yup.string().label("Password").required("Password is required."),});
class Home extends Component {
  constructor(props) {
    super(props);

    this.state = {
      username: "",password: "",press: false,ButtonStateHolder: false,};
  }
render() {
    return (
      <imagebackground style={{ width: "100%",height: "100%" }} source={bgImg}>
        <ScrollView>         
          <Formik
            initialValues={{ phoneNumber: "",password: "" }}
            onSubmit={(values,actions) => {
              this.setState({
                password: values.password,ButtonStateHolder: true,});
              console.warn(this.state.phoneNumber);
              console.warn(this.state.password);

            }}
            validationSchema={validationSchema}
          >
            {(formikProps) => (
              <React.Fragment>
                <View>
                  <View>
                    <Text>Phone number</Text>
                    <TextInputMask
                      keyboardType="number-pad"
                      ref={(ref) => (this.phoneField = ref)}
                      onChangeText={(formatted,extracted) => {                        
                        this.setState({
                          phoneNumber: extracted,});
                      }}
                      onChange={formikProps.handleChange("phoneNumber")}
                      onBlur={formikProps.handleBlur("phoneNumber")}
                      placeholder={""}
                      mask={"([000]) [000] [0000]"}
                    />
                    <Text style={styles.errMsg}>
                      {formikProps.touched.phoneNumber &&
                        formikProps.errors.phoneNumber}
                    </Text>
                  </View>
                  <View>
                    <Text style={styles.formlable}>Password</Text>
                    <TextInput
                      onChangeText={formikProps.handleChange("password")}
                      onBlur={formikProps.handleBlur("password")}
                      placeholder={""}
                      returnKeyType={"done"}
                      autoCapitalize={"none"}
                      autoCorrect={false}
                    />
                    <Text style={styles.errMsg}>
                      {formikProps.touched.password &&
                        formikProps.errors.password}
                    </Text>
                    
                    <TouchableOpacity
                      activeOpacity={0.7}
                      style={styles.btnEye}
                      onPress={this.showPass}
                    >
                      <Image source={eyeImg} style={styles.iconEye} />
                    </TouchableOpacity>
                  </View>
                </View>
                <View style={styles.loginBottom}>
                  <TouchableOpacity
                    style={styles.button}
                    onPress={() => formikProps.handleSubmit()}
                  >
                    <Text style={styles.buttonText}> Login </Text>
                  </TouchableOpacity>
                
                </View>
              </React.Fragment>
            )}
          </Formik>
        </ScrollView>
      </imagebackground>
    );
  }
}

export default Home;

onPress 控制台日志不打印 请有人帮忙解决这个问题

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其他元素将获得点击?
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。)
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbcDriver发生异常。为什么?
这是用Java进行XML解析的最佳库。
Java的PriorityQueue的内置迭代器不会以任何特定顺序遍历数据结构。为什么?
如何在Java中聆听按键时移动图像。
Java“Program to an interface”。这是什么意思?
Java在半透明框架/面板/组件上重新绘画。
Java“ Class.forName()”和“ Class.forName()。newInstance()”之间有什么区别?
在此环境中不提供编译器。也许是在JRE而不是JDK上运行?
Java用相同的方法在一个类中实现两个接口。哪种接口方法被覆盖?
Java 什么是Runtime.getRuntime()。totalMemory()和freeMemory()?
java.library.path中的java.lang.UnsatisfiedLinkError否*****。dll
JavaFX“位置是必需的。” 即使在同一包装中
Java 导入两个具有相同名称的类。怎么处理?
Java 是否应该在HttpServletResponse.getOutputStream()/。getWriter()上调用.close()?
Java RegEx元字符(。)和普通点?