输入文字验证本机反应

时间:2018-07-30 13:51:29

标签: reactjs react-native react-native-android

我有以下代码:

 <TextInput placeholder={"PID"}  keyboardType = 'numeric'  editable = {true}    maxLength = {10} value={this.state.text}  onChangeText={(text) => this.setState({text})} />   
 <Button title='NEXT' onPress= {() => navigate('service', { text: this.state.text})}> </Button>

我想验证输入字段,如下所示: 如果输入长度等于10,则按一下按钮,进入服务页面。 否则显示警报消息。

我该怎么做?

2 个答案:

答案 0 :(得分:1)

manage = () => {
    if (this.state.text.length === 10) {
        navigate('service', { text: this.state.text})})
    } else {
        alert('Your PID must be exactly 10 characters!')
    }
}

render() {
    return (<Button onPress={this.manage} ... />)
}

答案 1 :(得分:0)

亲爱的:)您需要使用路由包,例如react-navigation或react-native-router-flux(我喜欢后面的内容),用它定义您的页面,并在onPress函数中使用简单的if else语句...

每个路由包都为编程导航提供了一个简单的调用。