1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 | render() { let {getFieldDecorator} = this .props.form; const userShow = this .state.hasLogined ? <Menu.Item key= "logout" className= "register" > <Button type= "primary" htmlType= "button" >{ this .state.userNickName}</Button> <Link target= "_blank" > <Button type= "dashed" htmlType= "button" >个人中心</Button> </Link> <Button type= "ghost" htmlType= "button" onClick={ this .logout.bind( this )}>退出</Button> </Menu.Item> : <Menu.Item key= "register" className= "register" > <Icon type= "appstore" />注册/登录 </Menu.Item>; return ( <div id= "pcheader" > <header> <Row> <Col span={2}></Col> <Col span={4}> <a href= "/" className= "logo" > <img src= "../images/logo.png" alt= "logo" title= "ReactNews" /> <span>ReactNews</span> </a> </Col> <Col span={16}> <Menu mode= "horizontal" onClick={ this .handleClick.bind( this )} selectedKeys={[ this .state.current]}> <Menu.Item key= "top" ><Icon type= "appstore" />头条</Menu.Item> <Menu.Item key= "society" ><Icon type= "appstore" />社会</Menu.Item> <Menu.Item key= "internal" ><Icon type= "appstore" />国内</Menu.Item> <Menu.Item key= "international" ><Icon type= "appstore" />国际</Menu.Item> <Menu.Item key= "entertainment" ><Icon type= "appstore" />娱乐</Menu.Item> <Menu.Item key= "sports" ><Icon type= "appstore" />体育</Menu.Item> <Menu.Item key= "science" ><Icon type= "appstore" />科技</Menu.Item> <Menu.Item key= "fashion" ><Icon type= "appstore" />时尚</Menu.Item> {userShow} </Menu> |
.register{
float: right !important;
}
轻松入门 React 开发,React Router 4 与 Webpack 2 完美升级项目
了解课程