How to update a component's prop which has been saved in a const

user_15233241 0
Viewed 54

I have a parent component which is like this :

function parentComponent(){
     const [selectedValue,setSelectedValue] = useState();
     
     const [renderComponent,setRenderComponent] =[
           {
            name:'A' ,
            component : <ChildComponent values={selectedValue}/>
           },
           {
            name:'B' ,
            component : <OtherComponent/>
           },
     ]
     
    useEffect(()=>{
    
     const response = api('someapi');
     //i can get the response correctly and save it to state
     if(response.status===200){
     setSelectedValue(response.data);
     }
    },[])

    return <>{renderComponent[0].component}</>
     
}

and my child component is :

function childComponent({values}){
console.log('Props value is : ', values)

return <h3>Something</h3>

}

The problem is props are not updating and continue to return 'undefined' even after I update the state from the parent component

react-props reactjs state javascript
1 Answers
 

     useEffect(()=>{
       //set your state only after api data is completely fetched
   
         api('someapi').then((response)=>{
         console.log(response);// make sure this is not undefined
   
    if(response.status===200){
        setSelectedValue(response.data); 
        }
   }); 
   },[])
user_174374040
Related