使用可触摸不透明度清除文本输入而不关闭键盘?

Question

我想建立一个超级简单的聊天。 为此，有一个文本输入和一个可触摸的不透明度来发送消息和 清除文本输入。

问题：当我发送消息时，文本输入被清除，但是当再次开始写入时，旧文本再次复制到文本输入中(+新字符(。 但是，如果在发送和清除后关闭键盘，则一切正常 完全没问题。

有没有办法以可触摸的不透明度完全清除文本输入？

下面是代码和我自己的一些尝试，但没有一个奏效。 提前感谢，

马菲尼乌斯

<View style={{flexDirection: 'row'}}>
<TextInput
placeholder="Schreibe eine Nachricht"
onChangeText={(text) => this.setState({newMsg : text})}
style={{width: 300}}
ref={'ref1'}
/>
<TouchableOpacity
onPress={this.sendMessage}
>
<Text> --> </Text>
</TouchableOpacity>
</View>

sendMessage = () => {
this.state.MsgData.push({msg: this.state.newMsg, id: this.props.global.userId, timestamp: 8888});
this.refs['ref1'].clear();
this.setState({newMsg: ""});
//this.refs['ref1'].setNativeProps({text: ''})
//Keyboard.dismiss();
}

1. 列表项

Answer 1

使用 prop 设置状态的值defaultValue(https://facebook.github.io/react-native/docs/textinput.html#defaultvalue(

<TextInput
placeholder="Schreibe eine Nachricht"
onChangeText={(text) => this.setState({newMsg : text})}
style={{width: 300}}
ref={(input) => this.ref1 = input}
defaultValue={this.state.newMsg}
/>

有关完整实现，请参阅此示例：https://snack.expo.io/SkuH8hKPb