平台兼容性
支持矩阵
| 能力 | 微信小程序 | 支付宝小程序 | H5 |
|---|---|---|---|
| 基础树 / 展开收起 | ✅ | ✅ | ✅ |
| 单选 / 多选 / 父子联动 | ✅ | ✅ | ✅ |
| 搜索过滤 / 高亮 | ✅ | ✅ | ✅ |
| 懒加载 | ✅ | ✅ | ✅ |
| 虚拟渲染 | ✅ | ✅ | ✅ |
| 自定义插槽 | ✅ | ✅ | ✅ |
实现层面的兼容性说明
点击反馈用 hover-class
小程序不支持 CSS :hover / :active 伪类的可靠触发,组件内部使用 uni-app 的 hover-class 实现按压反馈,三端行为一致。
图标使用内联 iconfont
展开箭头、复选框图标通过 base64 内联字体实现,不依赖网络字体,离线可用,也避免了小程序 @font-face 远程加载的域名白名单问题。
虚拟渲染基于 scroll-view
虚拟滚动通过 scroll-view 的 scroll 事件 + 上下 padding 占位实现,不依赖 IntersectionObserver,因此在低版本小程序基础库上也能工作。
虚拟模式的两个前提
- 必须指定
virtual-height(容器高度,px) - 行高固定,由
virtual-item-height声明并应用到节点(px)
virtualHost
组件在微信/支付宝小程序上开启了 virtualHost: true,自定义组件不产生多余节点,外层样式(如 flex 布局)可以直接作用到组件根元素。
单位约定
indent缩进使用 rpx(跟随屏幕宽度缩放)virtual-height/virtual-item-height使用 px(滚动计算需要物理像素)
App 端
App-vue 理论上可用(实现未使用任何 H5 专属 API),但未经过充分测试;nvue 不支持。欢迎反馈使用情况。