jdf2e / nutui

京东风格的移动端 Vue 组件库,支持多端小程序(A Vue.js UI Toolkit for Mobile Web)
https://nutui.jd.com
MIT License
6.01k stars 814 forks source link

coundown pause 函数把事件错误的绑定到了restart 上了 #3061

Closed febelery closed 2 months ago

febelery commented 2 months ago

NutUI 包名

@nutui/nutui

NutUI 版本号

4.3.7

平台

h5

重现链接

https://nutui.jd.com/playground/#eyJBcHAudnVlIjoiPHRlbXBsYXRlPlxuICA8bnV0LXNwYWNlPlxuICAgIDxudXQtY291bnRkb3duIHJlZj1cIkNvdW50ZG93blwiIHRpbWU9XCIyNTAwXCIgOmF1dG8tc3RhcnQ9XCJmYWxzZVwiIGZvcm1hdD1cInNzOlNTXCIgQHBhdXNlZD1cIm9uUGF1c2VkXCIgIEBlbmQ9XCJvbkVuZFwiIEByZXN0YXJ0PVwib25SZXN0YXJ0XCIgLz5cbiAgICA8bnV0LWJ1dHRvbiBzaXplPVwibWluaVwiIEBjbGljaz1cInN0YXJ0XCI+IFN0YXJ0IDwvbnV0LWJ1dHRvbj5cbiAgICA8bnV0LWJ1dHRvbiBzaXplPVwibWluaVwiIEBjbGljaz1cInBhdXNlXCI+IFBhdXNlIDwvbnV0LWJ1dHRvbj5cbiAgICA8bnV0LWJ1dHRvbiBzaXplPVwibWluaVwiIEBjbGljaz1cInJlc2V0XCI+IFJlc2V0IDwvbnV0LWJ1dHRvbj5cbiAgPC9udXQtc3BhY2U+XG48L3RlbXBsYXRlPlxuPHNjcmlwdCBzZXR1cD5cbmltcG9ydCB7IHJlZiB9IGZyb20gJ3Z1ZSdcbmNvbnN0IENvdW50ZG93biA9IHJlZihudWxsKVxuY29uc3Qgc3RhcnQgPSAoKSA9PiB7XG4gIENvdW50ZG93bi52YWx1ZS5zdGFydCgpXG59XG5jb25zdCBwYXVzZSA9ICgpID0+IHtcbiAgQ291bnRkb3duLnZhbHVlLnBhdXNlKClcbn1cblxuY29uc3Qgb25QYXVzZWQgPSAodmFsKT0+e1xuICBjb25zb2xlLmxvZygncGFzdXNlJyx2YWwpXG59XG5cbmNvbnN0IG9uUmVzdGFydCA9ICh2YWwpPT57XG4gIGNvbnNvbGUubG9nKCdyZXN0YXJ0Jyx2YWwpXG59XG5cbmNvbnN0IG9uRW5kID0gKCk9PntcbiAgY29uc29sZS5sb2coJ2VuZCcsbmV3IERhdGUoKSlcbn1cblxuY29uc3QgcmVzZXQgPSAoKSA9PiB7XG4gIENvdW50ZG93bi52YWx1ZS5yZXNldCgpXG59XG48L3NjcmlwdD5cbiJ9

重现步骤

https://github.com/jdf2e/nutui/blob/v4.3.7/src/packages/__VUE/countdown/countdown.vue#L108

源码第104行开始, pause 函数绑定了错误的事件

// 暂定
const pause = () => {
  cancelAnimationFrame(timer.value!)
  counting.value = false
  emit('restart', restTime.value)
  emit('onRestart', restTime.value)
}

emit('restart', restTime.value) emit('onRestart', restTime.value)

应该为

// 暂停
const pause = () => {
  cancelAnimationFrame(timer.value!)
  counting.value = false
  emit('pause', restTime.value)
  emit('onPause', restTime.value)
}

emit('pause', restTime.value) emit('onPause', restTime.value)

期望的结果是什么?

暂停绑定 暂停 事件

实际的结果是什么?

暂停绑定 重置 了事件,这是错误的绑定

环境信息

No response

其他补充信息

No response

febelery commented 2 months ago

还有start也绑定restart事件,应该也是不对的

febelery commented 2 months ago

https://github.com/jdf2e/nutui/blob/v4.3.7/src/packages/__VUE/countdown/countdown.vue#L115

当执行reset的时候会调用pause, 这样会触发两次pause 函数,业务需要统计耗时这种就会产生双倍计时,也会有问题 @eiinu