Taroify

为页面提供导航功能，常用于页面顶部。

import { Navbar } from "@taroify/core"

代码演示

<Navbar title="标题" />

<Navbar title="标题">
  <Navbar.NavLeft onClick={onClick}>返回</Navbar.NavLeft>
  <Navbar.NavRight>按钮</Navbar.NavRight>
</Navbar>

<Navbar>
  <Navbar.NavLeft>返回</Navbar.NavLeft>
  <Navbar.Title>标题</Navbar.Title>
  <Navbar.NavRight icon={<Search />} />
</Navbar>

API

参数	说明	类型	默认值
title	标题	string	`''`
bordered	是否显示下边框	boolean	`true`
fixed	是否固定在顶部	boolean	`false`
safeArea	安全区域，可选值 `top` `bottom`，仅在`fixed=true`时有效	string	-
nativeSafeTop	是否启用顶部安全区域原生属性	boolean	`false`
placeholder	固定在顶部时，是否在标签位置生成一个等高的占位元素	boolean	`false`

参数	说明	类型	默认值
icon	左侧图标	Icon	-
children	左侧文案	ReactNode	-

参数	说明	类型	默认值
icon	右侧图标	Icon	-
children	右侧文案	ReactNode	-

组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 ConfigProvider 组件。