- Toast/Dialog/Notify 需要单独引入组件样式
import 'vant/es/dialog/index.less'
import 'vant/es/notify/index.less'
import 'vant/es/toast/index.less'
- Tab 标签页组件会两两加载,第一个tab和第二个tab会同时加载,开发过程注意因此产生的异步问题
- Popover 出现定位跑偏的情况,记得设置 teleport 指向父级元素(实在不行就绑到'#app'上吧)
- 修改Vant组件样式最好这样:
<template>
<van-config-provider :theme-vars="themeVars"> <!--组件外包裹此标签-->
<router-view></router-view>
</van-config-provider>
</template>
<script setup lang="ts">
// 统一样式修改,变量F12查找或文档查找
const themeVars = {
tabsBottomBarColor: '#003cbf',
tabsNavBackgroundColor: 'rgba(255,255,255,0)',
tabsLineHeight: '50px',
tabsBottomBarWidth: '2rem'
}
- 下拉菜单还是用官方 DropdownMenu 吧,Popover 配置有局限