我正在使用 React 和 Material-UI。我没有收到任何错误,但包含信息的组件没有显示任何内容
import React from "react";
import { RouteHandler } from "react-router";
import MainMenu from "components/MainMenu";
import _ from "lodash";
import mui, { RaisedButton, AppBar, FlatButton, Toolbar,
ToolbarGroup, DropDownMenu, ToolbarTitle, FontIcon,
DropDownIcon, ToolbarSeparator} from 'material-ui';
let ThemeManager = new mui.Styles.ThemeManager();
import styles from "./Application.css";
let filterOptions = [
{ payload: '1', text: 'All Broadcasts' },
{ payload: '2', text: 'All Voice' },
{ payload: '3', text: 'All Text' },
{ payload: '4', text: 'Complete Voice' },
{ payload: '5', text: 'Complete Text' },
{ payload: '6', text: 'Active Voice' },
{ payload: '7', text: 'Active Text' },
];
let iconMenuItems = [
{ payload: '1', text: 'Download' },
{ payload: '2', text: 'More Info' }
];
export default class Application extends React.Component {
childContextTypes: {
muiTheme: React.PropTypes.object
}
getChildContext() {
return {
muiTheme: ThemeManager.getCurrentTheme()
};
}
static getProps(stores, params) {
var transition = stores.Router.getItem("transition");
return {
loading: !!transition
};
}
render() {
var { loading } = this.props;
return <div className={styles.this + (loading ? " " + styles.loading : "")}>
<Toolbar>
<ToolbarGroup key={0} float="left">
<DropDownMenu menuItems={filterOptions} />
</ToolbarGroup>
<ToolbarGroup key={1} float="right">
<ToolbarTitle text="Options" />
<FontIcon className="mui-icon-sort" />
<DropDownIcon iconClassName="icon-navigation-expand-more" menuItems={iconMenuItems} />
<ToolbarSeparator/>
<RaisedButton label="Create Broadcast" primary={true} />
</ToolbarGroup>
</Toolbar>
<br />
<div className={styles.loadingElement}>loading...</div>
<MainMenu />
<RouteHandler />
</div>;
}
}
Application.contextTypes = {
stores: React.PropTypes.object
};
Application.childContextTypes = {
muiTheme: React.PropTypes.object
};
filterOptions
并且iconMenuItems
没有渲染,尽管其余的都可以。