CODEWITHSUNDEEP
javascriptreactjsreact-router
Nicholas Ritson
Nicholas Ritson

Reputation: 909

React Router White Screen

Using a similar React-Route from a previous project that worked but this one just gives a white screen, if i make a nav link in the root directory it changes the path but stays white. not sure why the content is not loading in. also have the code on repo: repo with code

index.js

import React from 'react';
import ReactDOM from 'react-dom';
import { Router, Route, browserHistory, IndexRoute } from 'react-router';

import App from './App';
import Test from './components/test';
import Home from './pages/home_page';
import './index.css';

ReactDOM.render((
  <Router history={browserHistory}>
    <Route path='/' component={App}>
      <IndexRoute component={Home}/>
      <Route path='/test' component={Test} />
    </Route>
  </Router>
), document.getElementById('app'))

App.js

import React, { Component } from 'react';
import './App.css';

export default class App extends Component {
  render() {
    return (
      <div>
       {this.props.childen}
      </div>
    );
  }
}

Just adding that the console has no errors and says it was compiled correctly with no warnings. The url does change but the content is not loaded to the page.

Upvotes: 0

Views: 3095

Answers (1)

paqash
paqash

Reputation: 2314

I cloned your repo and discovered the issue - it's a typo in App.js

{this.props.childen} -> {this.props.children}

It works now.

Upvotes: 5

Related Questions