React Native Promise, setState и проблема навигации

Question

Я новичок в переполнении стека, поэтому надеюсь, что публикую сообщения правильно. Я использую React, React Native и React Navigation. По сути, мне нужна помощь в переходе от одного экрана к другому и передаче данных, взятых из запроса на выборку. Кажется, что код работает, но setState не происходит до навигации. Если я go перейду на предыдущий экран и снова перейду вперед, ответ будет.

Помощь будет принята с благодарностью. Спасибо!

const [allResources, setAllResources] = React.useState([])
 
function getallresources() {
    fetch('API url', {
      method: 'POST',
      headers: {
        Accept: 'application/json',
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        info: info1,
        info2: info2,
      }),
    })
    .then((response) => response.json())
    .then((responseJson) => setAllResources(responseJson.allResources)
    .then(()=> navigation.navigate("AllResources", {allResources: allResources})
    )
    .catch((error) => {
      console.error(error);
    });
  }

Answer 1

setState не синхронно, хотя я не уверен, что это действительно проблема. Я бы попробовал передать responseJson.allResources напрямую и посмотреть, работает ли это для отладки, является ли обновление состояния проблемой:

const [allResources, setAllResources] = React.useState([])
 
function getallresources() {
    fetch('API url', {...} ),
    })
    .then((response) => response.json())
    .then((responseJson) => {
       setAllResources(responseJson.allResources)
       navigation.navigate("AllResources", {allResources: responseJson.allResources})
    })
    .catch((error) => {
      console.error(error);
    });
  }

Если это сработает, возможно, setState действительно проблема. Если это так, вы можете перемещаться из useEffect следующим образом:

useEffect( () => {
  if (allResources){
    navigation.navigate("AllResources", {allResources: allResources})
  }
}, [allResources])

(конечно, возьмите navigation.navigate из обратного вызова .then.) Если это не сработает, вы нужно посмотреть, как вы получаете доступ к своим allResources нашим params на экране AllResources.