React Native – Fetch POST request registration form

React-native Post request API call

In this article, we learn about React-native Fetch POST request registration form

on the last post, we created on registration form UI so we going to use these registrations form here and using Fetch POST request to send data I have created one table as follow  

API code is written in PHP I will write another article for API code

1. Create a project using the following command

2. Import following in your projects App.js

3. Define constructor

 

In this constructor, I defined a registerCall method also define username, email, password and baseUrl in react-native state

4. form UI

create form UI with the help of component as follows

add three TextInputLayout for Username, email, password and create one Sign up button using TouchableOpacity also added onChangeText will call when text change on TextInputLayout and set these value in the setState

then add onClickListener to text button view as follows

This is our style sheet

Then we write Fetch POST API call as follows

create a method which we had defined in the constructor registerCall in this method first define one variable and assign this to that variable as follows

then defined your URL below that

if you want to pass parameters from URL then use that.state.username not this.state.username

after that write fetch post method inside registerCall as follows

In above Fetch POST API call we are passing the body parameters like this

 

After success response, we are setting whole response data in the state that set the complete code for App.js is below

5. App.js

make sure after coding complete run following command in the project root folder which builds the project 

to see the log of API call run following command in the project root folder

6. Output:

 

React-native Fetch POST request registration form
React-native Fetch POST request registration form

Response

enjoy coding…  🙂

10 Replies to “React Native – Fetch POST request registration form”

  1. My brother suggested I might like this website.

    He was entirely right. This post actually made my day.
    You can not imagine simply how much time I had spent for this information! Thanks!

Leave a Reply

Your email address will not be published. Required fields are marked *