好客租房156-封装顶部导航栏组件(3功能处理withRouter)

简介: 好客租房156-封装顶部导航栏组件(3功能处理withRouter)
import React from 'react'
import { NavBar } from 'antd-mobile'
// 导入 withRouter 高阶组件
import { withRouter } from 'react-router-dom'
import "./index.scss"
 function NavHeader({children,history,onLeftClick}) {
 // 默认点击行为
 const defaultHandler = () => history.go(-1)
 return (
   <NavBar
     className="navbar"
     mode="light"
     icon={<i className="iconfont icon-back" />}
     onLeftClick={onLeftClick || defaultHandler}
   >
     {children}
   </NavBar>
 )
}
//函数的返回值也是一个组件
export default withRouter(NavHeader)

总结

图片.png

相关文章
|
6月前
|
数据库
Uniapp 横向滚动抽奖页面 组件 引用即可 全端
Uniapp 横向滚动抽奖页面 组件 引用即可 全端
201 0
|
存储 小程序 API
【 uniapp - 黑马优购 | 购物车页面(2)】如何实现收货地址区域功能、常见问题解决方案
【 uniapp - 黑马优购 | 购物车页面(2)】如何实现收货地址区域功能、常见问题解决方案
318 0
|
存储 小程序 前端开发
【易售小程序项目】小程序私聊页面完善(带尾巴聊天气泡组件封装、滑至顶端获取历史聊天数据逻辑优化)【后端基于若依管理系统开发】
【易售小程序项目】小程序私聊页面完善(带尾巴聊天气泡组件封装、滑至顶端获取历史聊天数据逻辑优化)【后端基于若依管理系统开发】
64 0
|
JavaScript 前端开发 开发者
数据工厂平台10: 首页底部
数据工厂平台10: 首页底部
数据工厂平台10: 首页底部
|
前端开发 JavaScript
数据工厂平台-7:菜单和首页
数据工厂平台-7:菜单和首页
数据工厂平台-7:菜单和首页
好客租房155-封装顶部导航栏组件(2样式调整)
好客租房155-封装顶部导航栏组件(2样式调整)
78 0
好客租房155-封装顶部导航栏组件(2样式调整)
|
定位技术
好客租房154-封装顶部导航栏组件(1顶部导航栏)
好客租房154-封装顶部导航栏组件(1顶部导航栏)
103 0
好客租房154-封装顶部导航栏组件(1顶部导航栏)
好客租房157-封装顶部导航栏组件(4添加props校验)
好客租房157-封装顶部导航栏组件(4添加props校验)
87 0
好客租房157-封装顶部导航栏组件(4添加props校验)
|
定位技术 API
好客租房130-获取顶部导航信息
好客租房130-获取顶部导航信息
141 0
好客租房130-获取顶部导航信息
|
定位技术
好客租房125-顶部导航
好客租房125-顶部导航
99 0
好客租房125-顶部导航