Reactjs.NET-道具未定义并停留在为什么?

时间:2018-12-10 15:06:59

标签: reactjs react-router material-ui reactjs.net

所以我仍然可以通过reactjs.net + asp.net核心找到自己的脚。我已经将material-ui.com的最新版本(v1)导入了组合。我正在尝试将两者结合起来,但是类/道具的组成存在问题。

下面的代码是我被告知需要的逐字记录,并通过数小时的在线搜索找到了。然而,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)

0 个答案:

没有答案