NavBar 导航栏

引入

通过以下方式来全局注册组件,更多注册方式请参考。

基础用法

通过 属性设置导航栏标题。

  1. <van-nav-bar title="标题" />
  1. export default {
  2. setup() {
  3. const onClickLeft = () => history.back();
  4. return {
  5. onClickLeft,
  6. };
  7. },
  8. };

右侧按钮

在导航栏右侧添加可点击的按钮。

  1. export default {
  2. setup() {
  3. const onClickLeft = () => history.back();
  4. const onClickRight = () => Toast('按钮');
  5. return {
  6. onClickLeft,
  7. onClickRight,
  8. };
  9. };

使用插槽

可以通过插槽自定义导航栏两侧的内容。

Slots

Events

    样式变量

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