You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Currently I have a component: QuickAdd that needs the google autocomplete api to run
However, while the component renders, it doesn't seem like the autocomplete has finished loading. If i go to another component and then return to the QuickAdd component then it works, which makes me think it needs to rerender after the script is loaded.
The globalName is always passed as a prop and but is always undefined. What other listener can i use for this?
Ok so I found a way to make it worked properly I guess. Here's what I did :
in the parent of my AsyncComponent
importGeosuggestfrom"@components/geosuggest";constComponent=()=>{const[geosuggestActive,setActive]=useState(false);constGOOGLE_URL=`https://maps.googleapis.com/maps/api/js?key=${process.env.REACT_APP_GOOGLE_KEY}&libraries=places`;constAsyncGeosuggest=makeAsyncScriptLoader(GOOGLE_URL,{globalName: "google"})(Geosuggest,);return(<AsyncGeosuggestasyncScriptOnLoad={()=>setActive(true)}// the important props for the callbackisActive={geosuggestActive}// just pass the state, and display a placeholder instead nothing when not loaded/>);}
Currently I have a component: QuickAdd that needs the google autocomplete api to run
However, while the component renders, it doesn't seem like the autocomplete has finished loading. If i go to another component and then return to the QuickAdd component then it works, which makes me think it needs to rerender after the script is loaded.
The globalName is always passed as a prop and but is always undefined. What other listener can i use for this?
const callbackName = "onloadcallback"; const globalName = "quickAddLoader"; const url =
https://maps.googleapis.com/maps/api/js?key=API_KEY&libraries=places`;const AsyncHoc = makeAsyncScriptLoader(url, {globalName: globalName})(QuickAdd);
export default AsyncHoc; `
The text was updated successfully, but these errors were encountered: