1I would do something like this:
2
3var myComponent = React.createComponent({
4
5 getInitialState: function () {
6 return {
7 showCancel: false,
8 };
9 },
10
11 toggleCancel: function () {
12 this.setState({
13 showCancel: !this.state.showCancel
14 });
15 }
16
17 _renderCancel: function () {
18 if (this.state.showCancel) {
19 return (
20 <TouchableHighlight
21 onPress={this.toggleCancel()}>
22 <View>
23 <Text style={styles.cancelButtonText}>Cancel</Text>
24 </View>
25 </TouchableHighlight>
26 );
27 } else {
28 return null;
29 }
30 },
31
32 render: function () {
33 return (
34 <TextInput
35 onFocus={this.toggleCancel()}
36 onChangeText={(text) => this.doSearch({input: text})} />
37 {this._renderCancel()}
38 );
39 }
40
41});