Reactjs 下拉图标材质界面反应

我试图创建一个带有下拉图标的应用程序栏，但它没有出现在应用程序栏中，但是当我与检查器一起检查页面时，我找到了下拉列表的所有字段，所以我不知道为什么它没有出现。这是我的js文件：

var React=require（'React'）；
var mui=要求（“材料-ui”）；
var ThemeManager=新的mui.Styles.ThemeManager（）；
var Colors=mui.style.Colors；
var-AppBar=mui.AppBar；
var SvgIcon=mui.SvgIcon；
var DropDownIcon=mui.DropDownIcon；
var Main=React.createClass({
childContextTypes：{
muiTheme:React.PropTypes.object
},
getChildContext（）{
返回{
muiTheme:ThemeManager.getCurrentTheme（）
};
},
组件willmount（）{
管理器设置调色板({
Primary1颜色：颜色。teal500
});
},
render（）{
变量容器样式={
显示：'table-header-group'
};
var innercontainerStyle={
显示：“表格单元格”，
垂直排列：'中间'，
textAlign:“中心”
};
var ContainerRapperStyle={
高度：“100%”，
显示：“表格”，
宽度：“100%”
};
var urlIcon=''；
返回(


添加城市

);
}
});
var ActionOption=React.createClass({
render:function（）{
var stile={
边距：“12px 12px 0”，
填充：“0 8px”
};
返回(
);
}
});
var DDIcon=React.createClass({
render:function（）{
变量菜单项=[
{payload:'1'，text:'Never'}，
{有效载荷：“2”，文本：“每晚”}，
{有效载荷：'3'，文本：'Weeknights'}，
{有效负载：“4”，文本：“周末”}，
{payload:'5'，text:'Weekly'}，
];      
返回(
);
}
});
React.render（，document.body）