所以我仍然可以通过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)