-
Notifications
You must be signed in to change notification settings - Fork 269
[ospp]给Tree组件增加虚拟滚动功能
Kagol edited this page Sep 26, 2024
·
9 revisions
任务清单:https://github.com/orgs/opentiny/projects/5
git clone [email protected]:opentiny/tiny-vue.git
git checkout ospp-2024/001-tree-virtual-scroll
pnpm i --registry=https://registry.npmmirror.com
pnpm site
访问:http://localhost:3101/,进入 VirtualScroll 和 Tree 组件的 demo。
验证功能点:
- 封装通用的 VirtualScroll 虚拟滚动组件
- 基本的嵌套节点虚拟滚动
- 增删改场景的虚拟滚动
- 拖拽树场景的虚拟滚动
- 节点搜索场景的虚拟滚动
- E2E测试用例
- API/Demo文档
在 Vite+Vue3+TinyVue 和 Webpack(VueCLI)+Vue2+TinyVue 项目中安装和使用。
执行命令:
pnpm build:ui virtual-scroll
可以构建 virtual-scroll 组件的产物(tree组件同理),产物地址在 packages/dist2(vue2版本) 和 packages/dist3(vue3版本) 两个目录下。
发包之前可以将 @opentiny/vue-virtual-scroll
改成 @yourname/vue-virtual-scroll
,再到 dist3/@yourname/vue-virtual-scroll
下执行:npm publish --access public
进行发布。
- 发布virtual-scroll的npm包之后,无法在Vite+Vue3项目中使用
已发布npm包:@kagol/vue-virtual-scroll
,在Vite+Vue3项目中安装这个包,然后拷贝virtual-scroll第一个demo进行使用,npm run dev 存在报错。
- API 文档书写不符合规范
- demo 中的 style 样式需要控制影响范围