Question

我是新来的反应者和火力发源人。

问题：

我正在尝试访问一个变量，该变量在成功获取结果时返回true，它在.then方法内部工作，但是在方法外部则无法获取结果（isStudent变量）。一世任何建议，提示都会有所帮助。

     const Routes = props => {
                  if (props.user) {
                     let isStudent=false;

                    const uid = props.user.uid;

                    firebase
                      .database()
                      .ref(`student/${uid}`)
                      .once("value")
                      .then(snapshot => {
                        if (snapshot.val().role === "student") {
                          console.log(snapshot.val());
                            isStudent=true
                        }
                      });

                    console.log(isStudent); //false
//i am getting the default value, if i remove that i get undefined

                  return (
                    <MainLayout>
                      <Switch>

                <StudentPublicRoute
                          {...props}
                          exact
                          restricted={true}
                          path="/student/login"
                          component={StudentLogin}
                        />
                        {isStudent&& <StudentPrivateRoute
                          {...props}
                          path="/student/studentdashboard"
                          exact
                          component={StudentDash}
                        />}
                 </Switch>
                    </MainLayout>

Answer 1

方法once返回一个Control.SelectNextControl，这意味着您的函数将异步运行，因此函数console.log在从firebase获得响应之前就运行了。

根据您的情况，您需要将isStudent的值保留在Promise中。

结果将是这样的：

class YourComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {isStudent: false};
  }
  ...

  firebase
  .database()
  .ref(`student/${uid}`)
  .once("value")
  .then(snapshot => {
  if (snapshot.val().role === "student") {
      this.setState({
        isStudent: true
    });
  }

}

Answer 2

这是因为console.log（isStudent）在isStudent = true之前执行。

由于调用Firebase会花费一些时间，因此情况总是如此。考虑也使用类组件而不是功能组件，并使用诸如redux / saga或redux / thump之类的框架进行此类异步调用。

也许您可以尝试使用await / async，它可能会起作用。

您的代码将永远无法使用。

然后如何在方法之外访问firebase结果

2 个答案: