alibaba / rax

🐰 Rax is a progressive framework for building universal application. https://rax.js.org
Other
8k stars 627 forks source link

[BUG]rax-Countdown没有支持ms #2279

Closed xmsz closed 2 years ago

xmsz commented 2 years ago

背景

fengzilong commented 2 years ago

确实不支持,文档有误

xmsz commented 2 years ago

确实不支持,文档有误

ok 那可以支持不

我们的场景是抢购倒计时,需要毫秒这种看起来更有紧迫感

fengzilong commented 2 years ago

https://github.com/alexkhismatulin/react-use-count-down/blob/master/src/index.js

你可以参考这个,尝试自己写一个 hook(代码量不多,基本拿来改改就能用)

rax-countdown 内部使用的是 setTimeout,没法做到真正的每 ms 更新视图

而且 setTimeout 的 interval 没法简单地设成 1ms 或者 10ms,跑久了误差会越来越大,底层要换成 requestAnimationFrame,改动比较大

你提到的抢购需求,实际场景一般毫秒那个位置都是 100 → 0 → 100 循环,或者 10 → 0 → 10 循环,在 rax-countdown 的 tpl 那里支持 ms 不实用,只能解决一个问题,不能解决一类问题

rax-countdown 要不要支持还得 @SoloJiang @chenjun1011 再看看

SoloJiang commented 2 years ago
  1. 可以直接使用 react-use-countdown,把 react alias 到 rax 就好
  2. rax-countdown 目前是维护状态,如果可以贡献代码的话,提供一个路径参考:
    • 将 react-use-countdown 的代码同步更新到 rax-use-countdown
    • rax-countdown break change 掉,改为直接依赖 rax-use-countdown
xmsz commented 2 years ago
  1. 可以直接使用 react-use-countdown,把 react alias 到 rax 就好

ok

fengzilong commented 2 years ago

ok

看了下我上面提到的那个 npm 包的源码,实现上有点 bug,我晚点提个 PR 到 rax-use-countdown 修复下

fengzilong commented 2 years ago

https://github.com/raxjs/rax-hooks/pull/18

@xmsz 可以追踪下这个 PR,合入发版后就可以用了,有问题欢迎随时反馈