Navbar 导航条

<!-- 默认导航条 -->
  <re-navbar class="demo-default" title="标题" />

<!-- 带返回箭头的导航栏 -->
  <re-navbar class="demo-left-arrow" title="标题" :leftArrow="true" leftText="返回" />

<!-- 左侧图标 -->
  <re-navbar class="demo-left-icon" title="标题" leftIcon="close" />

<!-- 右侧图标 -->
  <re-navbar class="demo-right-icon" title="标题" rightIcon="ellipsis" />

<!-- 右侧文字+图标 -->
  <re-navbar class="demo-right-text-icon" title="标题" rightIcon="search" rightText="搜索" />

<!-- 左对齐标题 -->
  <re-navbar class="demo-left-align" title="左对齐标题" titleAlign="left" />

<!-- 标题省略 -->
  <re-navbar class="demo-title-ellipsis" title="这是一个超长标题演示文案" :titleMaxLength="6" />

<!-- 胶囊插槽 -->
  <re-navbar class="demo-capsule" title="标题" :leftArrow="true"> <template #capsule> <text class="demo-capsule__text">菜单</text> </template> </re-navbar>

<!-- 固定定位+占位 -->
  <re-navbar class="demo-fixed" title="固定导航" :fixed="true" :placeholder="true" customStyle="top: 24px; left: 16px; right: 16px; border-radius: 18px; box-shadow: 0 18px 44px rgba(15, 23, 42, 0.18);" />

<!-- 自定义样式 -->
  <re-navbar class="demo-custom-style" title="自定义" bgColor="#0052d9" titleColor="#ffffff" textColor="#ffffff" customStyle="border-bottom-width: 0px;" />

<!-- 无标题 -->
  <re-navbar class="demo-empty" leftText="返回" rightText="设置" />

<!-- 关闭安全区适配 -->
  <re-navbar class="demo-no-safe" title="无安全区" :safeAreaInsetTop="false" />