如何使用Vant的Sidebar组件

要使用Vant的Sidebar组件，首先需要安装Vant UI库。可以使用npm或者yarn进行安装：

npm install vant

或者

yarn add vant

然后在需要使用Sidebar组件的地方引入：

<template>
  <div>
    <van-sidebar v-model="activeKey">
      <van-sidebar-item title="Option1" :key="1" />
      <van-sidebar-item title="Option2" :key="2" />
      <van-sidebar-item title="Option3" :key="3" />
    </van-sidebar>
  </div>
</template>

<script>
import { ref } from 'vue';
import { Sidebar, SidebarItem } from 'vant';

export default {
  components: {
    VanSidebar,
    VanSidebarItem
  },
  setup() {
    const activeKey = ref(1);

    return {
      activeKey
    };
  }
};
</script>

在上面的示例中，我们通过import引入了Sidebar和SidebarItem组件，并在template中使用了这两个组件。activeKey是一个响应式变量，用来控制当前选中的菜单项。通过v-model指令我们将activeKey和Sidebar组件进行了双向绑定。每个SidebarItem组件表示一个菜单项，通过设置key属性来标识不同的菜单项。