反应firebase auth()setState不在then()内部工作

Question

我有这个twitter登录firebase文件,我想保存uid状态,但它不起作用.有什么想法在这里发生？

twitterSignin(provider) {

    var provider = new firebase.auth.TwitterAuthProvider();
    var getStoreID = this.props.storeId;

    firebase.auth().signInWithPopup(provider)
        .then(function (result) {
            var token = result.credential.accessToken;
            var user = result.user;

            var ref = firebase.database().ref(getStoreID);

            ref.once("value")
                .then(function (snapshot) {
                    var data = snapshot.val();

                    if (!data.owner) {
                        ref.set({
                            owner: result.user.uid
                        })
                    }

                    this.setState({
                        uid: result.user.uid
                    })

                });
        }).catch(function (error) {
            console.log(error.code)
            console.log(error.message)
        });
}

谢谢

固定:

    twitterSignin(provider) {

        var provider = new firebase.auth.TwitterAuthProvider();
        var getStoreID = this.props.storeId;
var that = this;

        firebase.auth().signInWithPopup(provider)
            .then(function (result) {
                var token = result.credential.accessToken;
                var user = result.user;

                var ref = firebase.database().ref(getStoreID);

                ref.once("value")
                    .then(function (snapshot) {
                        var data = snapshot.val();

                        if (!data.owner) {
                            ref.set({
                                owner: result.user.uid
                            })
                        }

                        that.setState({
                            uid: result.user.uid
                        })

                    });
            }).catch(function (error) {
                console.log(error.code)
                console.log(error.message)
            });
    }

Answer 1

问题是您尝试setState从不同的范围访问.为了解决问题,您需要将回调绑定到实例.为此您有两个选项,使用bind,缓存父作用域const me = this;,然后me在回调中使用或使用箭头函数.

twitterSignin(provider) {

  var provider = new firebase.auth.TwitterAuthProvider();
  var getStoreID = this.props.storeId;

  firebase.auth().signInWithPopup(provider)
    .then((result) => {
      var token = result.credential.accessToken;
      var user = result.user;

      var ref = firebase.database().ref(getStoreID);

      ref.once("value")
        .then((snapshot) => {
          var data = snapshot.val();

          if (!data.owner) {
            ref.set({
             owner: result.user.uid
            })
          }

          this.setState({
            uid: result.user.uid
          })

        });
  }).catch(function (error) {
    console.log(error.code)
    console.log(error.message)
  });
}

我会选择箭头功能.

一个箭头函数在外部范围内执行,在这种情况下是范围twitterSignin,这是你的反应组件,与setState:) 的一个