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

简介: 好客租房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={[
          //  
          //    key="0"
          //    type="search"
          //    style={{ marginRight: '16px' }}
          //  />,
          //  ,
          // ]}
        >
          城市选择
        </NavBar>
      </div>
    )
  }
}
export default cityList

运行结果

图片.png

相关文章
|
人工智能 物联网 大数据
阿里云Vlog 签约深圳中青旅1000个景区 沉浸式旅游成趋势
2021年1月29日,中青旅投资控股(深圳)有限公司(简称“深圳中青旅”)携旗下控股子公司深中青云谷智游(杭州)科技有限公司(简称“深中青智游”),与阿里云联合签约Vlog框架合作协议,阿里云专门针对文旅行业推出的边缘AI产品解决方案阿里云Vlog将全面覆盖深圳中青旅1000个景区,并为这些景区打造全新的“沉浸式旅游”。
433 12
阿里云Vlog 签约深圳中青旅1000个景区 沉浸式旅游成趋势
|
缓存
好客租房150-切换城市
好客租房150-切换城市
116 0
好客租房150-切换城市
好客租房165-根据定位获取当前城市
好客租房165-根据定位获取当前城市
145 0
好客租房165-根据定位获取当前城市
好客租房166-根据定位获取当前城市
好客租房166-根据定位获取当前城市
122 0
好客租房166-根据定位获取当前城市
|
定位技术
好客租房171-地图找房renderOverlays
好客租房171-地图找房renderOverlays
142 0
好客租房171-地图找房renderOverlays
好客租房175-获取当前小区被点击房源数据
好客租房175-获取当前小区被点击房源数据
113 0
好客租房175-获取当前小区被点击房源数据
|
定位技术
好客租房173-地图找房createCircle方法
好客租房173-地图找房createCircle方法
221 0
好客租房173-地图找房createCircle方法
好客租房158-在城市界面使用navbar
好客租房158-在城市界面使用navbar
135 0
好客租房158-在城市界面使用navbar
|
定位技术
好客租房125-顶部导航
好客租房125-顶部导航
104 0
好客租房125-顶部导航
|
定位技术 API
好客租房130-获取顶部导航信息
好客租房130-获取顶部导航信息
145 0
好客租房130-获取顶部导航信息