Ошибка типа: объект (...) не является функцией в REACT- JS (проблема в редукторах) - PullRequest
Новая
       3

Ошибка типа: объект (...) не является функцией в REACT- JS (проблема в редукторах)

0 голосов
/ 19 февраля 2020

Вы можете подумать, что это та же самая ошибка, на которую много раз отвечают. Я сам много исследовал, но не смог решить. Так что проблема в редукторе, вот что я знаю. В настоящее время у меня есть две панели в моем проекте, Admin и User. Я не могу получить доступ к пользователю из-за редуктора. Ошибка, отображаемая на экране, См. Это изображение enter image description here Теперь делюсь своим кодом ниже,

ConfigureStore, который находится в папке маршрутов, 

export const ConfigureStore = () => {

const store= createStore(rootReducer,
    compose(
      applyMiddleware(thunk.withExtraArgument(getFirebase)),
      reactReduxFirebase(fbConfig)
      )  
    );

 return store;
}

actionSignIn. js

export const signIn = (credentials) => {
  return (dispatch, getState, {getFirebase}) => {
    const firebase = getFirebase();

    firebase.auth().signInWithEmailAndPassword(
      credentials.email,
      credentials.password
    ).then(() => {
      dispatch({ type: 'LOGIN_SUCCESS' });
    }).catch((err) => {
      dispatch({ type: 'LOGIN_ERROR', err });
    });

  }
}

ReducerSignIn. js

const initState = {
  authError: null
}

const authReducer = (state = initState, action) => {
  switch(action.type){
    case 'LOGIN_ERROR':
      console.log('login error');
      return {
        ...state,
        authError: 'Login failed'
      }

    case 'LOGIN_SUCCESS':
      console.log('login success');
      return {
        ...state,
        authError: null
      }

UserLoginForm. js

handleSubmit = (e) => {
     e.preventDefault();
    this.props.signIn(this.state)
  }

  render() {
    const { email, password, error } = this.state;
    return (
      <div className="container" style={{textAlign:"center"}}>
        <form className="white" onSubmit={this.handleSubmit}>
          <h5 className="grey-text text-darken-3">Sign In</h5>

          <div className="input-field">
            <label htmlFor="email">Email</label>
            <input type="email" id='email' value={email} onChange={this.handleChange} />
          </div>
          <div className="input-field">
            <label htmlFor="password">Password</label>
            <input type="password" id='password' value={password} onChange={this.handleChange} />
          </div>
          <div className="input-field">
            <button className="btn pink lighten-1 z-depth-0">Login</button>
            <div className="center red-text">
            {error ? (<Flex><Box><Text>{error.message}</Text></Box></Flex>) : null}           
             </div>
          </div>
        </form>
      </div>
    )
  }
}

И импорт ConfigureStore в App. js как 

const store = ConfigureStore();

class App extends Component {
  render(){
  return (
    <Provider store={store}>
      <BrowserRouter>
      <div >
       <MainComponent/>
      </div>
      </BrowserRouter>
      </Provider>
  );
}
}

Спросите, нужна ли какая-либо дополнительная информация, заранее спасибо

...