Reactjs.NET - Опоры не определены и застряли на том, почему?

Question

Так что я все еще нахожусь в ногах с реагирующим ядром + ядро ​​asp.net. Я импортировал последнюю версию (v1) материала-ui.com в смесь. Я пытаюсь объединить два, но у меня есть проблемы с составом классов / реквизита.

Приведенный ниже код дословно того, что мне сказали, что мне нужно, и я нашел его в течение нескольких часов поиска в Интернете. Еще, this.props.classes продолжать бросать undefined ошибки.

Есть ли шаг, который я пропускаю?

import React, { Component } from 'react';

import PropTypes from 'prop-types';

import { withStyles } from '@material-ui/core/styles';
import AppBar from '@material-ui/core/AppBar';
import Toolbar from '@material-ui/core/Toolbar';
import Typography from '@material-ui/core/Typography';
import Button from '@material-ui/core/Button';
import IconButton from '@material-ui/core/IconButton';
import MenuIcon from '@material-ui/icons/Menu';



const homeStyles = {
  root: {
    height: 200 ,
    flexGrow: 1,
  },

  grow: {
    flexGrow: 1,
  },

  menuButton: {
    marginLeft: -12,
    marginRight: 20,
  },
};


export class Home extends React.Component {


    displayName = Home.name

    constructor(props) { 
        super(props);
        console.log("Props: " + props != null);
    }

  render() {

      const { classes } = this.props;

      return (
         <div>
            <div className={classes.root}>
            <AppBar position="static">
            <Toolbar>
              <IconButton style={classes.menuButton} color="inherit" aria-label="Menu">
                <MenuIcon />
              </IconButton>
              <Typography variant="h6" color="inherit" style={classes.grow}>Undefined? {(this.props == undefined).toString()}</Typography>
              <Button color="inherit">Login</Button>
            </Toolbar>
          </AppBar>
          </div>
        </div>
    );

   }
}

Home.propTypes = {
  classes: PropTypes.object.isRequired
};

export default withStyles(homeStyles)(Home)