feat: ✨ 调整 composables 的导出,新增 useCountDown 的导出 - #1242
Conversation
✅ Deploy Preview for wot-design-uni ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
Walkthrough将 useLockScroll 改为具名导出并更新相关组件导入;新增 composables 聚合导出入口;根 index.ts 改为通配符导出所有 composables,并新增 CommonUtil、clickOut 命名空间导出、locale 导出与类型导出;补齐多项 composable 的公开导出(含 useCountDown)。 Changes
Sequence Diagram(s)sequenceDiagram
participant App as App/外部代码
participant Pkg as wot-design-uni/index.ts
participant Comps as components/composables/index.ts
participant Hook as useCountDown / useLockScroll
App->>Pkg: import { useCountDown, useLockScroll, ... }
Pkg-->>Comps: export * from './components/composables'
Comps-->>Hook: re-export 具名导出
Hook-->>App: 提供钩子函数
Note over Pkg,Comps: useLockScroll 由默认导出改为具名导出
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Assessment against linked issues
Assessment against linked issues: Out-of-scope changes
Possibly related PRs
Poem
Tip 🔌 Remote MCP (Model Context Protocol) integration is now available!Pro plan users can now connect to remote MCP servers from the Integrations page. Connect with popular remote MCPs such as Notion and Linear to add more context to your reviews and chats. ✨ Finishing Touches
🧪 Generate unit tests
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. CodeRabbit Commands (Invoked using PR/Issue comments)Type Other keywords and placeholders
CodeRabbit Configuration File (
|
Deploying wot-design-uni with
|
| Latest commit: |
51bec0e
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://f77e7fc1.wot-design-uni.pages.dev |
| Branch Preview URL: | https://feat-use-count-down-export.wot-design-uni.pages.dev |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
组件测试摘要 (H5 平台)测试时间: Tue Aug 26 08:29:56 UTC 2025测试结果
|
There was a problem hiding this comment.
Actionable comments posted: 0
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
src/uni_modules/wot-design-uni/components/composables/useLockScroll.ts (1)
4-21: 模块级滚动锁与样式恢复重构当前实现中,每次调用
useLockScroll都创建独立的实例级计数器,会在多组件同时锁滚动时发生竞态:任一实例先提前解锁会重置body.style.overflow,导致其他实例失效;且直接置空样式会覆盖页面已有的自定义 overflow,还缺少 H5/SSR 环境下的document访问保护。请在以下位置做出调整:
- 文件:
src/uni_modules/wot-design-uni/components/composables/useLockScroll.ts,将实例级ref(0)改为模块级全局计数(避免多实例竞态)。- 首次加锁时保存
document.body.style.overflow原始值,最后一次解锁时恢复,而非直接置空。- 在
lock/unlock内部对document访问前加if (typeof document === 'undefined') return,兼容 H5、SSR 等非浏览器环境。下面是最小侵入的改造示例:
import { onBeforeUnmount, onDeactivated, ref, watch } from 'vue' - export function useLockScroll(shouldLock: () => boolean) { - const scrollLockCount = ref(0) + // 模块级:统一管理全局锁计数与原样式 + let __wdScrollLockCount = 0 + let __wdBodyPrevOverflow: string | null = null + + export function useLockScroll(shouldLock: () => boolean) { const lock = () => { - if (scrollLockCount.value === 0) { - document.getElementsByTagName('body')[0].style.overflow = 'hidden' - } - scrollLockCount.value++ + if (typeof document === 'undefined') return + if (__wdScrollLockCount === 0) { + __wdBodyPrevOverflow = document.body.style.overflow + document.body.style.overflow = 'hidden' + } + __wdScrollLockCount++ } const unlock = () => { - if (scrollLockCount.value > 0) { - scrollLockCount.value-- - if (scrollLockCount.value === 0) { - document.getElementsByTagName('body')[0].style.overflow = '' - } - } + if (typeof document === 'undefined') return + if (__wdScrollLockCount > 0) { + __wdScrollLockCount-- + if (__wdScrollLockCount === 0) { + document.body.style.overflow = __wdBodyPrevOverflow ?? '' + __wdBodyPrevOverflow = null + } + } } const destroy = () => { shouldLock() && unlock() } watch(shouldLock, (value) => { value ? lock() : unlock() }) onDeactivated(destroy) onBeforeUnmount(destroy) return { lock, unlock } }
🧹 Nitpick comments (4)
src/uni_modules/wot-design-uni/components/wd-overlay/wd-overlay.vue (1)
29-29: 建议从目录 barrel 导入,降低路径耦合有了 components/composables/index.ts 后,可以统一从目录导入,后续重命名/迁移单文件不影响调用方。
-// #ifdef H5 -import { useLockScroll } from '../composables/useLockScroll' +// #ifdef H5 +import { useLockScroll } from '../composables' // #endifsrc/uni_modules/wot-design-uni/components/wd-video-preview/wd-video-preview.vue (2)
35-35: 同上,建议从 barrel 导入,减少对具体文件名的依赖统一入口便于后续维护与 tree-shaking。
-import { useLockScroll } from '../composables/useLockScroll' +import { useLockScroll } from '../composables'
6-16: 变量命名拼写错误:previdewVideo → previewVideo这是一个小拼写问题,但在公开代码中建议修正,提升可读性与 IDE/搜索体验。
@@ - v-if="previdewVideo.url" + v-if="previewVideo.url" @@ - :poster="previdewVideo.poster" - :title="previdewVideo.title" + :poster="previewVideo.poster" + :title="previewVideo.title" @@ - :src="previdewVideo.url" + :src="previewVideo.url" @@ -const previdewVideo = reactive<PreviewVideo>({ url: '', poster: '', title: '' }) +const previewVideo = reactive<PreviewVideo>({ url: '', poster: '', title: '' }) @@ - previdewVideo.url = video.url - previdewVideo.poster = video.poster - previdewVideo.title = video.title + previewVideo.url = video.url + previewVideo.poster = video.poster + previewVideo.title = video.title @@ - previdewVideo.url = '' - previdewVideo.poster = '' - previdewVideo.title = '' + previewVideo.url = '' + previewVideo.poster = '' + previewVideo.title = ''Also applies to: 39-59
src/uni_modules/wot-design-uni/index.ts (1)
18-19: 命名空间导出命名风格不一致(CommonUtil vs clickOut)建议统一命名规则(例如都用 PascalCase),同时为了避免潜在破坏性变更,可以新增一个别名导出,过一到两个小版本再考虑移除旧名。
export * as CommonUtil from './components/common/util' -export * as clickOut from './components/common/clickoutside' +export * as clickOut from './components/common/clickoutside' +// 可选:新增别名,保持向后兼容 +export * as ClickOutside from './components/common/clickoutside'
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
💡 Knowledge Base configuration:
- MCP integration is disabled by default for public repositories
- Jira integration is disabled by default for public repositories
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (5)
src/uni_modules/wot-design-uni/components/composables/index.ts(1 hunks)src/uni_modules/wot-design-uni/components/composables/useLockScroll.ts(1 hunks)src/uni_modules/wot-design-uni/components/wd-overlay/wd-overlay.vue(1 hunks)src/uni_modules/wot-design-uni/components/wd-video-preview/wd-video-preview.vue(1 hunks)src/uni_modules/wot-design-uni/index.ts(2 hunks)
🧰 Additional context used
🧠 Learnings (1)
📓 Common learnings
Learnt from: Moonofweisheng
PR: Moonofweisheng/wot-design-uni#534
File: docs/component/form.md:44-44
Timestamp: 2024-08-19T13:43:36.518Z
Learning: Moonofweisheng prefers addressing syntax errors such as missing quotation marks in the code.
🧬 Code graph analysis (1)
src/uni_modules/wot-design-uni/components/composables/useLockScroll.ts (1)
src/uni_modules/wot-design-uni/components/composables/index.ts (1)
useLockScroll(4-4)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: Generate Test Summary
🔇 Additional comments (5)
src/uni_modules/wot-design-uni/components/composables/useLockScroll.ts (1)
3-3: 请人工确认useLockScroll默认导入已彻底移除我已在全仓库范围内运行以下脚本,未发现任何默认导入用法:
rg -nP "import\s+useLockScroll\s+from\s+['\"][^'\"]*composables/useLockScroll['\"]" -Srg -nP "import\s+useLockScroll\s+from\s+['\"][^'\"]*wot-design-uni(?:/components/composables/useLockScroll)?['\"]" -S但“无匹配不代表绝对不存在”,请重点检查以下场景以确保无遗漏:
- 包根入口(如
index.ts)或中转模块的隐式转发- 动态导入/
require情况- 文档示例中对旧写法的引用
确认全部无残留后,即可安全合并此 PR。
src/uni_modules/wot-design-uni/components/wd-overlay/wd-overlay.vue (1)
29-29: 具名导入与 composable 改动一致,👍和 useLockScroll 改为具名导出保持一致,避免编译期找不到默认导出。
src/uni_modules/wot-design-uni/components/wd-video-preview/wd-video-preview.vue (1)
35-35: 具名导入改动合理,和 composable 一致无语义变更,编译期一致性更好。
src/uni_modules/wot-design-uni/components/composables/index.ts (1)
1-11: 确认:useCountDown 已正确纳入公共 API 并可从根入口导入验证结果:
src/uni_modules/wot-design-uni/components/composables/useCountDown.ts文件存在,且包含export function useCountDown声明src/uni_modules/wot-design-uni/components/composables/index.ts已显式导出export { useCountDown } from './useCountDown'- 根入口
src/uni_modules/wot-design-uni/index.ts已通过export * from './components/composables'聚合导出经以上验证,无遗漏或导出名/实现名不一致问题,变更可直接合入。
建议后续在文档或 CHANGELOG 中新增“从根入口新增导出 useCountDown(import { useCountDown } from 'wot-design-uni')”的提示,以提升用户可发现性。src/uni_modules/wot-design-uni/index.ts (1)
13-22: 请确认根入口意图公开的导出列表下面是当前
src/uni_modules/wot-design-uni/index.ts的所有导出项,请核对是否均为有意对外暴露的公共 API:
export { useToast } from './components/wd-toast'export { useMessage } from './components/wd-message-box'export * from './components/composables'export * from './components/wd-notify'export { default as dayjs } from './dayjs'export * as CommonUtil from './components/common/util'export * as clickOut from './components/common/clickoutside'export * from './locale'若有不希望暴露的内部实现模块,请移除对应导出或改为仅选择性导出稳定的 hooks,以避免意外扩大公共 API 面。
✅ Closes: #1239
🤔 这个 PR 的性质是?(至少选择一个)
🔗 相关 Issue
#1239
💡 需求背景和解决方案
composables统一导出
☑️ 请求合并前的自查清单
Summary by CodeRabbit
新功能
重构