Реагировать — Использовать асинхронную функцию для рендеринга в JSX?

# #reactjs #promise #jsx #firebase-storage #es6-promise

Вопрос:

Как я могу использовать функцию обещания внутри возврата компонента, например:

 function MyComp () {  return (  lt;divgt;  {getFirebasePromise(ref).then(url =gt; return url)}  lt;/divgt;  ) }  

Таким образом, результат был бы:

 lt;divgt;urlFromFirebaselt;/divgt;  

Должен ли я использовать a useState() , даже если у меня есть несколько обещаний в одном и том же компоненте?

Комментарии:

1. Вы не можете использовать обещание там, оно может еще не существовать при первом рендеринге

Ответ №1:

Вы можете использовать useState и useEffect для этого.

 function MyComp () {  [url, setUrl] = useState("");  useEffect(()=gt;{  getFirebasePromise(ref).then(url =gt; setUrl(url));  });    return (  lt;divgt;  {url}  lt;/divgt;  ) }