I'm starting to learn react native, therefore I'm following the documentation, however, I can not test the TextInput, I copy past the example from the official documentation but nothing appears in my app.
I also remarked that when I add other components they doesn't appears also, however, when I remove the TextInput they appears as expected.
I searched online for some solution, I find a lot, but non works for me ( mostly the talked about the height of the component...).
also there is no error neither in the app nor in the debugger-gui
does anybody have a solution?
Edit1
to get started with react I followed the instructions and create AwsomeProject,
then in the app.js (I also tried to create a separte component and call it in app.js) I added this code :
<View style={{ backgroundColor: 'red' }}>
<TextInput style={{ backgroundColor: '#ededed', height: 60 }} value={'Hello'} />
</View>
It's hard to know without a code example but are you importing TextInput at the top of the file?
import { TextInput } from 'react-native';
I think by adding flex:1 and onChangeText in the textInput will solve the issue
import * as React from 'react';
import {View, TextInput,Button} from 'react-native';
export default class App extends React.Component {
state={
text:"Hello"
}
render() {
return (
<View style={{ backgroundColor: 'red',flex:1,justifyContent:'center'}}>
<TextInput style={{ backgroundColor: 'red', height: 60,width:300 ,borderWidth:1,borderColor:"white"}} value={this.state.text} onChangeText={(text) => this.setState({text})}/>
<Button
title="Learn More"
color="#841584"
accessibilityLabel="Learn more about this purple button"
/>
</View>
);
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With