好客租房132-城市选择导航栏

1打开ant design moblie导航栏的文档

2从文档中拷贝示例代码进入页面开始学习

import React from 'react'

//导入navBar组件
import { NavBar, Icon } from 'antd-mobile'
import "./index.scss"
class cityList extends React.Component {
	render() {
		return (
			<div className='citylist'>
				<NavBar className='navbar'
					mode="light"
					icon={<i className='iconfont icon-back' />}
					onLeftClick={() => this.props.histoty.push.go(-1)}
                    // 导航栏右边内容
					// rightContent={[
					// 	<Icon
					// 		key="0"
					// 		type="search"
					// 		style={{ marginRight: '16px' }}
					// 	/>,
					// 	<Icon key="1" type="ellipsis" />,
					// ]}
				>
					城市选择
				</NavBar>
			</div>
		)
	}
}

export default cityList

运行结果

微信公众号关注前端小歌谣获取全部代码