代码之家 › 专栏 › 技术社区 › Thanh-Quy Nguyen

nativeEvent.text后面的setState()

react-native reactjs

0

Thanh-Quy Nguyen · 技术社区 · 10 年前

我正在调用 onChange 的属性 TextInput 以便在输入更改时更新状态。这里是:

onInputChanged(event) {
    // Seems to be a delay before updating the nicknameString (1 typing late)
    this.setState({ nicknameString: event.nativeEvent.text });
    console.log(this.state.nicknameString);
    console.log(event.nativeEvent.text);
}

但是……第一个日志显示字符串,其中一个输入较晚,即当我键入时 Asdf ,将显示第一个日志 Asd 第二个显示的时间 Asdf公司 。然后,如果删除f,将显示第一个日志 Asdf公司 (一次键入较晚)第二次显示时 Asd公司 (应该如此)。

有什么解释吗?

1 回复 | 直到 10 年前

1

Nader Dabit 10 年前

您正在记录的值 this.state. nicknameString 在它有机会注册之前。

要在以下情况下立即检查状态: setState ,您可以做一些事情,下面是几个示例:

1: 之后在回调中注销状态 设置状态 已完成:

this.setState({
    nicknameString: text
}, () => {
    console.log('nicknameString:', this.state.nicknameString)
})

2: 调用setImmediate将函数置于事件队列中已存在的任何I/O事件回调之后。

this.setState({
    nicknameString: text
})
setImmediate(() => console.log('nicknameString:', this.state.nicknameString))

我已经用这两种方法建立了示例 here .

https://rnplay.org/apps/WRUcVw