2017-06-05 2 views
1

Kann mir jemand helfen herauszufinden, wie man diese Einrichtung funktioniert.reagieren - Redux - Router-Setup-Probleme

import 'babel-polyfill'; 
    import React from 'react'; 
    import ReactDOM from "react-dom"; 
    import {Provider} from 'react-redux'; 
    import {createStore, applyMiddleware} from 'redux'; 
    import thunk from 'redux-thunk'; 
    import promise from 'redux-promise'; 
    import createLogger from 'redux-logger'; 
    import allReducers from './reducers'; 
    import App from './components/App'; 
    import createHistory from 'history/createBrowserHistory' 
    import { Route } from 'react-router-dom' 
    import { ConnectedRouter, routerMiddleware, push } from 'react-router-redux' 

    const logger = createLogger(); 

    // Create a history of your choosing (we're using a browser history in this case) 
    const history = createHistory() 

    // Build the middleware for intercepting and dispatching navigation actions 
    const middleware = routerMiddleware(history) 

    // Add the reducer to your store on the `router` key 
    // Also apply our middleware for navigating 
    const store = createStore(
    allReducers, 
    applyMiddleware(middleware, thunk, promise, logger) 
    ) 

    ReactDOM.render(
     <Provider store={store}> 
      <ConnectedRouter history={history}> 
      <div> 
       <Route exact path="/" component={App}/> 
      </div> 
      </ConnectedRouter> 
     </Provider>, 
     document.getElementById('root') 
    ); 

Ich bekomme anscheinend einen Fehler genannt. Warnung: React.createElement: Typ ist ungültig - erwartet eine Zeichenkette (für eingebaute Komponenten) oder eine Klasse/Funktion (für zusammengesetzte Komponenten) aber hat: undefiniert. Wahrscheinlich haben Sie vergessen, Ihre Komponente aus der Datei zu exportieren, in der sie definiert ist.

+0

Nun, wie der Fehler sagt, haben Sie wahrscheinlich vergessen, 'export default App;' als letzte Zeile Ihrer 'App.js' Komponentendatei hinzuzufügen. – DrunkDevKek

+0

! [Das habe ich] (https://pbs.twimg.com/media/DBn8QE0XsAA1Ec1.jpg:large). –

Antwort

1

Stellen Sie sicher, dass alle Ihre Components Hierarchie App ordnungsgemäß als Standardexport exportiert werden.

Werfen Sie auch einen Blick auf, wo Sie Ihre react-routerComponents aus nehmen. Es ist ein häufiger Fehler zu versuchen, Link Komponente von react-router Modul zu importieren, während es nur in react-router-dom Modul existiert.

0

Vielen Dank für das Feedback die Antwort war ConnectedRouter war undefined. Ich habe diesen Import jetzt korrekt behoben.