Question

当我尝试运行react-app时出现此“ TypeError：Object（...）不是一个函数”。

im在redux存储中获取错误。我不知道为什么我会收到这个错误，是因为它与React-Router有关。

这是我的文件

import React from 'react';
import ReactDOM from 'react-dom';
import {
BrowserRouter as Router,
Switch,
Route,
Link
} from "react-router-dom";
import './Institute/Style/style.css'
import { ProtectedRoute } from './Institute/Protectedroutes/index'
import { Provider } from 'react-redux';
import store from './Redux/store/storage';
import 'bootstrap/dist/css/bootstrap.min.css';
//Some more Components imported here.


 class App extends React.Component {
   render() {

  return (
    <div>
      <div>
      <div id="navbar">
        <ul id="nav">
          <li>
            <Link to='/'>
              Home
            </Link>
          </li>
          <li>
            <Link to='/profilepage'>
              Profile
            </Link>
          </li>
          <li>
            <Link to='/events'>
              Events
            </Link>
          </li>
          <li>
            <Link to='/jobs'>
              Jobs
            </Link>
          </li>
          <li>
            <Link to='/login'>
              Login
            </Link>
          </li>
          <li id="sch">
            <Link to='/searchprofile'>
            Search People</Link>
          </li>
          </ul>
      </div>
      <div>
      </div>
    </div>

      <Switch>
        <Route path='/' exact component={Home}/>
        <Route path='/login' component={Login}/>
        <ProtectedRoute path='/searchprofile' component={Searchprofile}/>
        <ProtectedRoute path='/profilepage' component={Profilepage}/>
        <ProtectedRoute path='/jobs' component={Jobs}/>
        //More Routes here
        <Route path='*' component={() => "(404 Not Found)"}/>
      </Switch>
    </div>
  );
  }
}


 ReactDOM.render(

 <Provider store={store}>
    <Router> 
        <App/>
    </Router>
 </Provider>,
 document.getElementById('root')
 );

这是动作文件夹中的动作文件

const Auth_True =  () => {
 return{
    type: 'Auth_True',
    Auth_State: true
  }
  }

   const Auth_False =  () => {
     return{
        type: 'Auth_False',
         Auth_State: false
     }
     }


  export default {Auth_False,Auth_True};

这是我来自reducers文件夹的Reducers

const intialState = {
Auth_state : false
}

const authstate = (state = intialState, action) => {
switch(action.type){
    case 'Auth_True':
        return{

            Auth_state: action.Auth_state
        }
    case 'Auth_False':
        return{

            Auth_state: action.Auth_state
        }
    default:
        return state;
}
} 

export default authstate;

以及商店文件夹中的商店-从此文件中获取错误，或者我不知道确切显示的位置

import { createStore } from 'react'
import authstate from '../reducers/reducers'

const store = createStore(authstate);

export default store;

最后是我分派动作的组件

import React from 'react';
import { connect } from 'react-redux'
import Auth_True from '../../Redux/action/actions'
import Auth_False from '../../Redux/action/actions'


class Login extends React.Component{
   render(){
     return(
         <div>

            <div>
            <h3>Auth State : {this.props.Auth}</h3>
            <button onClick={this.props.change_state_true}>Set True</button>
            <button onClick={this.props.change_state_false}>Set False</button>
            </div>
         </div>

      );
      }
      }

      const mapStatesToProps = state => {
      return{
      Auth : state.Auth_State
      }
       }

      const mapDispatchToProps = dispatch => {
       return{
       change_state_true : () => dispatch(Auth_True()),
       change_state_false : () => dispatch(Auth_False())
         }
          }

       export default connect(mapStatesToProps,mapDispatchToProps)(Login);

你们能否请我帮助我理解为什么发生这种情况，这是由于React-Router还是我派遣的组件中的connect函数造成的，还是Redux和React不支持的版本？

Answer 1

代替import { createStore } from 'react';

尝试import { createStore } from 'redux';

TypeError：Object（...）不是一个函数-Redux-React-Router

1 个答案: