ReactJS class.contextType API提供未定义和空值

时间:2019-09-28 05:00:16

标签: reactjs

为什么我的函数仍然是空对象?使用class.contextType API

我并没有包装我想直接与class.contextType一起使用的消费者并访问提供者值,但是它给了我错误的值

这是我的提供者

export const AuthServiceContext = React.createContext({
          user: null,
          isLoggedIn: false,
          _defaultLogin: () => {},
          _googleLogin: () => {}
})
export class AuthService extends React.Component{
   state = {
      user: null,
      isLoggedIn: false,
      _defaultLogin: this.useDefaultLogin,
      _googleLogin: this.useGoogleLogin
  }
}

useDefaultLogin(email, password){
   ....
}

....
render(){
    return (
    <AuthService.Provider value={this.state}>
         //Not really wrapping anything i want to directly get the context values
         </AuthService.Provider>
    )
}

这是我的使用者,导入上下文并使用class.contextType api

import { AuthServiceContext } from './utils/AuthService'

class Login extends React.Component{
    constructor(){
        super();
    }

    static myContext = AuthServiceContext;

    login = (e) => {
        const { _defaultLogin } = this.context;
        console.log(this.context) /* isAuthenticated: null,
                                     userData: null,
                                    _defaultLogin: () => {},
                                    _googleLogin: () => {},

                                    */
     _defaultLogin(email, password) // not a function
       ....
      }
}

Login.contextType = AuthServiceContext;;

console.log(_defaultLogin) //未定义

0 个答案:

没有答案