0

I am new to reactjs. I am having a problem in data communication between two components.

I am using material table in my application to list the data. I am having the create user form in different component. When a new user is created i need to update that newly added user in the list. Both are in different components. How can i share the data between two components?

prasanth
  • 22,145
  • 4
  • 29
  • 53
Rana
  • 135
  • 1
  • 2
  • 8

2 Answers2

1

there are two ways of doing it:

  1. if your project is small you can just pass create a parent container component that hold all the state and pass it to both child component
  2. this is where state management library is created for you can go with redux approach that is very popular or other like mobx
Potato
  • 770
  • 1
  • 8
  • 18
  • As of now i am not going to use redux or mobx as my application is little small. I will go with first approach. Could you please provide any documentation? I am using function component in my application – Rana Sep 03 '19 at 07:31
  • since you are using functional component you could take a look at useState https://reactjs.org/docs/hooks-state.html – Potato Sep 03 '19 at 07:39
  • it may look complicated but it is not and could replace redux in many use case – Potato Sep 03 '19 at 07:40
0

Keep User form as parent component. Create a state in the user form component and add user data array to the state. Send the array as a prop to the table component. Whenever you submit the user form, update the data into the array in the state. As state is changed, it will be rendered.

ysd31
  • 88
  • 7