React Passing函数作为参数错误

时间:2019-06-19 12:39:23

标签: javascript reactjs

我正在为我的应用程序使用React-redux firestore。我有一个表单,在提交时,传递了要保存的详细信息,以及一个在成功更新Firestore时执行成功消息的函数。收到以下错误 “添加文档时出错:TypeError:func不是函数”

任何帮助表示赞赏

提交功能

handleSubmit = (e) => {
        e.preventDefault();
        let uid = this.props.auth.uid;
        const { sp_License } = this.state;
        let err = this.validate();
        if (!err) {
          this.setState({ loading: true,disChecked:false })
          const Lfilename = this.state.sp_Name + '_' + new Date().getTime();
          const uploadTask = storage.ref('License/' + Lfilename).put(sp_License);
          uploadTask
            .then(uploadTaskSnapshot => {
              return uploadTaskSnapshot.ref.getDownloadURL();
            })
            .then(url => {
              this.setState({ sp_License: url });
              const stateObj = this.state;
             this.props.UpdateUserDetails(uid, stateObj, this.successMessage)

            });
        }
    }

successMessage = () => {
        this.setState({
            message: 'Registration Successfull.!',
            open: true,
            loading: false,
        });
    };

动作方法

export const UpdateUserDetails= (id, droneSPDetails,func) => {
    console.log(droneSPDetails)
    console.log(func)
    return (dispatch, getState, { getFirestore }) => {
        const firestore = getFirestore()
        firestore.collection('users')
            .doc(id)
            .set({
                 ...droneSPDetails,
                sp_RegisteredOn: new Date(),
                sp_Status:"pending",
                sp_ActiveFlag:"1",
            },{ merge: true })
            .then(() => {
                func();
                dispatch({ type: 'CREATE_DRONESP', droneSPDetails });

            })
            .catch((error) => {
                console.error("Error adding document: ", error);
            });
    }
}

1 个答案:

答案 0 :(得分:0)

这可能是由于this的作用域。建议您保持原始引用,在handleSubmit()的开头声明一个额外的变量以保存当前的this。像这样:

handleSubmit = (e) => {

        // maintain the reference
        const self = this


        e.preventDefault();
        let uid = this.props.auth.uid;
        const { sp_License } = this.state;
        let err = this.validate();
        if (!err) {
          this.setState({ loading: true,disChecked:false })
          const Lfilename = this.state.sp_Name + '_' + new Date().getTime();
          const uploadTask = storage.ref('License/' + Lfilename).put(sp_License);
          uploadTask
            .then(uploadTaskSnapshot => {
              return uploadTaskSnapshot.ref.getDownloadURL();
            })
            .then(url => {

              this.setState({ sp_License: url });
              const stateObj = this.state;
              this.props.UpdateUserDetails(uid, stateObj, self.successMessage) // use original reference, `self` instead of `this`


            });
        }
    }