好客租房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

相关文章
|
数据库
会议OA必备!解密Layui神技:轻松构建动态可控的左侧权限菜单列表!
会议OA必备!解密Layui神技:轻松构建动态可控的左侧权限菜单列表!
98 0
|
3月前
|
前端开发
前端如何制作简易的菜单多级导航栏
前端如何制作简易的菜单多级导航栏
98 0
|
8月前
|
前端开发 JavaScript
uniapp联动左侧导航栏分类?
uniapp联动左侧导航栏分类?
|
8月前
【最全最详细】使用publiccms实现动态可维护的导航菜单栏
【最全最详细】使用publiccms实现动态可维护的导航菜单栏
|
小程序
发布 ivx页面(1)写用户协议页面
发布 ivx页面(1)写用户协议页面
159 0
|
小程序 算法 Java
微信小程序制作顶部导航栏
微信小程序制作顶部导航栏
179 0
|
前端开发
前端工作总结188-导航栏使用
前端工作总结188-导航栏使用
44 0
前端工作总结188-导航栏使用
|
JavaScript 前端开发 开发者
数据工厂平台10: 首页底部
数据工厂平台10: 首页底部
数据工厂平台10: 首页底部
好客租房155-封装顶部导航栏组件(2样式调整)
好客租房155-封装顶部导航栏组件(2样式调整)
84 0
好客租房155-封装顶部导航栏组件(2样式调整)
|
定位技术
好客租房154-封装顶部导航栏组件(1顶部导航栏)
好客租房154-封装顶部导航栏组件(1顶部导航栏)
109 0
好客租房154-封装顶部导航栏组件(1顶部导航栏)