0

Is it possible to sent api response from one component to another component using useState().

In GridHierarchy Componnet I want to show data in kendo TreeList. I declared useState variable..

    const GridHierarchy = () => {
    
      const [procesi, setProcesi] = useState([]);
      const [showTree, setShowTree] = useState(false);
    
    const [state, setState] = React.useState({
        data: [...procesi],
        dataState: {
          sort: [{
            field: 'name',
            dir: 'asc'
          }],
          filter: []
        },
        expanded: []
      });

 return (

  <div>
    <div>
      <InputGrid  setProcesi={setProcesi} setShowTree={setShowTree} />
      
      {console.log(showTree)}
    
    </div>

In input Component i want to store api response in useState() and then show that data in GridHierarchy component.

const InputGrid = ({setProcesi,setShowTree}) => {

const rowClick =  async (event) => {

  const response = await Services.getTreeData(event.dataItem.snidservisnenarudzbe)
                              setProcesi(response.data.rlista == null ? [] : response.data.rlista)

When i console.log variable procesi in GridHierarchy component i get:props:[object Object]

aa123
  • 1

1 Answers1

0

I suggest you put all your request to Redux store and use the store state in every component when you need them.

When the request is called from a component only the component will have the response. Even if you store it in useState it doesn't let you conveniently handle with response.

The idea of Redux is: all your data is stored there and all your request are dispatched by component like triggers. Then you simply don't have to create a complicated hierarchy between components and make them more abstract. You just use the subscription for store state and see the result everywhere.

Leonid Grudanov
  • 1