react-native – React Native clear text多个TextInput框
发布时间:2020-12-15 20:42:24 所属栏目:百科 来源:网络整理
导读:我在facebook React Native页面上找到了示例代码,该页面显示了如何使用setNativeProp清除单击上的文本,但我看不到如何使用多个文本框进行操作.这是代码: var App = React.createClass({ clearText() { this._textInput.setNativeProps({text: ''}); },rende
我在facebook React Native页面上找到了示例代码,该页面显示了如何使用setNativeProp清除单击上的文本,但我看不到如何使用多个文本框进行操作.这是代码:
var App = React.createClass({ clearText() { this._textInput.setNativeProps({text: ''}); },render() { return ( <View style={styles.container}> <TextInput ref={component => this._textInput = component} style={styles.textInput} /> <TouchableOpacity onPress={this.clearText}> <Text>Clear text</Text> </TouchableOpacity> </View> ); } }); ref似乎在函数中被修复,因此将始终以相同的TextInput框为目标.如何更改函数以定位我指示的任何TextInput框?
这应该工作.请注意,TextInput上的引用必须是您从clearText functino调用的引用.
var App = React.createClass({ clearText(fieldName) { this.refs[fieldName].setNativeProps({text: ''}); },render() { return ( <View style={styles.container}> <TextInput ref={'textInput1'} style={styles.textInput} /> <TouchableOpacity onPress={() => this.clearText('textInput1')}> <Text>Clear text</Text> </TouchableOpacity> <TextInput ref={'textInput2'} style={styles.textInput} /> <TouchableOpacity onPress={() => this.clearText('textInput2')}> <Text>Clear text</Text> </TouchableOpacity> </View> ); } }); 更新了我的答案以清除不同的字段. (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |
相关内容
- ruby-on-rails – 用Ransack一次搜索多个模型
- React Native(一) FlexBox布局
- 核心数据 – 使用swift 3和Xcode 8 beta对NSManagedObject进
- 严重: Caught exception while loading file com/bh/action
- 通配符和正则表达式的区别
- objective-c – 使用CIFilter和CISpotColor正确过滤NSImage
- 正则表达式 学习笔记(二)
- TinyXML2 Tutorial
- 如何在华为交换机上实现链路聚合
- 报错error:Error parsing XML:unbound prefix的解决办法