Quantcast
Channel: Active questions tagged react-native+ios - Stack Overflow
Viewing all articles
Browse latest Browse all 16750

React Native TextInput setState() issue

$
0
0

I am having an issue with React Native's this.setState() within a TextInput's onChangeText. I am trying to display the content of the TextInput in the Text tag below it. However, it displays nothing -- the setState() call never changes this.state.searchtext. I also get no errors. Thank you in advance for your help! Here is my code:

 export default class ShowScreen extends Component {
constructor(props) {
    super(props);
    this.state = {
        searchtext: ""
    };
}
render() {
    var thisscreen = (
        <View>
            <ScrollView
                horizontal={true}
                showsHorizontalScrollIndicator={false}
                pagingEnabled={true}
            >
                <View
                    style={{
                        flex: 1,
                        height: totalheight,
                        justifyContent: "space-around",
                        alignItems: "center",
                        width: totalwidth,
                        backgroundColor: "#FF0000"
                    }}
                >
                    <TextInput
                        style={{ height: 80, fontSize: 20 }}
                        placeholder="placeholder"
                        value={this.state.searchtext}
                        onChangeText={searchtext =>
                            this.setState({ searchtext })
                        }
                        ref={input => {
                            this.textInput = input;
                        }}
                        returnKeyType="go"
                    />
                    <Text>{this.state.searchtext}</Text>
                </View>
            </ScrollView>
        </View>
    );
    return thisscreen;
}
}

Viewing all articles
Browse latest Browse all 16750

Trending Articles