React - 组件渲染后更改的值

Question

我一直在开发一个与食物相关的 React Native 应用程序，对于登录，我想分离为普通用户和餐厅返回的堆栈。

我遇到的问题是restaurantUserChecker的返回值与第二个UseEffect得到的不同。 console.log('1', doc.exists)为真，因此应该返回真。 但是console.log('2', val)是 false ，这会导致所有用户获得相同的堆栈。

  async function restaurantUserChecker(){
  const check = firestore().collection('restaurantUsers').doc(auth().currentUser.uid); 

    await (check.get()).then((doc) => {
    if (doc.exists) {
      console.log('1', doc.exists);
      return true;
    }
  }).catch((error) => console.log(error));

  return false;
}

  function MyStack() {

  const [restaurantUser, setRestaurantUser] = useState(false);

  useEffect(() => {
    console.log(auth().currentUser.uid);
    restaurantUserChecker().then((val) => {
      console.log('2', val);
      setRestaurantUser(val);
    }).catch((error) => console.log(error));
  }, []);

  if(restaurantUser){
    return <RestaurantHomeStack/>
  }

  return <DrawerNavigator />;
}

export default function App() {
  return (
    <SafeAreaProvider>
      <NavigationContainer>
        <MyStack/>
      </NavigationContainer>
    </SafeAreaProvider>
  );
}

我将不胜感激各种帮助，因为我在这个问题上已经挣扎了好几个小时。

Answer 1

您的 function restaurantUserChecker必须返回 Promise。

async function restaurantUserChecker() {
    return new Promise(async (resolve, reject) => {
        const check = firestore()
        .collection("restaurantUsers")
        .doc(auth().currentUser.uid);

    await check
        .get()
        .then((doc) => {
            if (doc.exists) {
                console.log("1", doc.exists);
                resolve(true);
            }
        })
        .catch((error) =>{ console.log(error); reject(error)});

    resolve(false);
    });
}

Answer 2

正如其他答案所暗示的，您不需要从restaurantUserChecker返回 promise。 then允许在async function 上调用。 对restaurantUserChecker的以下更改也应按您的预期执行。

async function restaurantUserChecker(){
  const check = firestore()
        .collection("restaurantUsers")
        .doc(auth().currentUser.uid);

  try {
     var doc = await check.get();
     if (doc.exists) {
        console.log('1', doc.exists);
        return true;
     }
  } catch(error) {
       console.log(error);
  }
  return false;
}

Answer 3

您的两个答案都有效，现在我了解导致问题的原因。 如果允许我在这里引用蝙蝠侠的话，你们是我们不配但需要的英雄。 非常感谢你们！