Question

在React native中，我想在onBlur事件处理程序中传递TextInput的值。

onBlur={(e) => this.validateText(e.target.value)}

e.target.value适用于简单的React。但是，在react-native中，e.target.value是未定义的。 react-native中可用的事件args的结构是什么？

Answer 1

在React Native中，您可以从e.nativeEvent.text获取TextInput的值。

不幸的是，这对multiline={true}不起作用。解决这个问题的方法是保持对TextInput的引用，并通过组件的_lastNativeText属性访问文本值。例如（假设您已为TextInput组件指定了“textInput”的引用）：

onBlur={() => console.log(this.refs.textInput._lastNativeText)}

Answer 2

您应该使用'onEndEditing'方法而不是'onBlur'

onEndEditing？：function文本输入结束时调用的回调函数。

onBlur是一个组件函数，其中onEndEditing特定于TextInput

onEndEditing

这种方法适用于多线和单线。

<TextInput 
    onEndEditing={(e: any) => 
    {
        this.setState({textValue: e.nativeEvent.text})
    }
}/>

Answer 3

简单的解决方案：通过这种方式onBlur，您所在州的电子邮件将始终具有用户更改的最后一个值。

           validate = () => {
            const { email } = this.state
            console.log('Validating Email Here!', email)
           }

          <TextInput
           style={styles.input}
           placeholder='E-mail'
           onChangeText={email => this.setState({email})}
           onBlur={e => this.validate()}
         />

Answer 4

<TextInput onBlur={() => alert("This is cute")} placeholder="Enter your budget" />

当调用onBlur时，如何获取TextInput中的值？

4 个答案: