Browse Source

fix(NoticeBar): speed、height 设置为某些值时,不触发滚动问题 (#894)

* feat: sku

* feat: 可配置颜色提出

* feat: prop 调整

* fix: noticebar 极限值报错问题修改
yangxiaolu1993 4 years ago
parent
commit
a610fcd14a
2 changed files with 12 additions and 35 deletions
  1. 4 9
      src/packages/__VUE/countdown/index.vue
  2. 8 26
      src/packages/__VUE/noticebar/index.vue

+ 4 - 9
src/packages/__VUE/countdown/index.vue

@@ -12,10 +12,8 @@
         <view class="nut-cd-dot">天</view>
       </template>
       <view class="nut-cd-block">{{ resttime.h }}</view
-      ><view class="nut-cd-dot">:</view
-      ><view class="nut-cd-block">{{ resttime.m }}</view
-      ><view class="nut-cd-dot">:</view
-      ><view class="nut-cd-block">{{ resttime.s }}</view>
+      ><view class="nut-cd-dot">:</view><view class="nut-cd-block">{{ resttime.m }}</view
+      ><view class="nut-cd-dot">:</view><view class="nut-cd-block">{{ resttime.s }}</view>
     </template>
   </view>
 </template>
@@ -73,7 +71,7 @@ export default create({
     }
   },
   components: {},
-  emits: ['input', 'on-end', 'on-restart', 'on-paused'],
+  emits: ['input', 'on-end', 'on-restart', 'on-paused', 'update:modelValue'],
 
   setup(props, { emit, slots }) {
     console.log('componentName', componentName);
@@ -209,10 +207,7 @@ export default create({
 
         const d = ts >= ds ? parseInt(ts / ds) : 0;
         const h = ts - d * ds >= hs ? parseInt((ts - d * ds) / hs) : 0;
-        const m =
-          ts - d * ds - h * hs >= ms
-            ? parseInt((ts - d * ds - h * hs) / ms)
-            : 0;
+        const m = ts - d * ds - h * hs >= ms ? parseInt((ts - d * ds - h * hs) / ms) : 0;
         const s = Math.round((ts - d * ds - h * hs - m * ms) / 1000);
 
         if (d >= 0) rest.d = d + '';

+ 8 - 26
src/packages/__VUE/noticebar/index.vue

@@ -8,26 +8,14 @@
       @click="handleClick"
       v-if="direction == 'across'"
     >
-      <view
-        class="left-icon"
-        v-if="iconShow"
-        :style="{ 'background-image': `url(${iconBg})` }"
-      >
-        <nut-icon
-          name="notice"
-          size="16"
-          :color="color"
-          v-if="!iconBg"
-        ></nut-icon>
+      <view class="left-icon" v-if="iconShow" :style="{ 'background-image': `url(${iconBg})` }">
+        <nut-icon name="notice" size="16" :color="color" v-if="!iconBg"></nut-icon>
       </view>
       <view ref="wrap" class="wrap">
         <view
           ref="content"
           class="content"
-          :class="[
-            animationClass,
-            { 'nut-ellipsis': !scrollable && !wrapable }
-          ]"
+          :class="[animationClass, { 'nut-ellipsis': !scrollable && !wrapable }]"
           :style="contentStyle"
           @animationend="onAnimationEnd"
           @webkitAnimationEnd="onAnimationEnd"
@@ -40,11 +28,7 @@
       </view>
     </view>
 
-    <view
-      class="nut-noticebar-vertical"
-      v-if="scrollList.length > 0 && direction == 'vertical'"
-      :style="barStyle"
-    >
+    <view class="nut-noticebar-vertical" v-if="scrollList.length > 0 && direction == 'vertical'" :style="barStyle">
       <template v-if="slots.default">
         <view class="horseLamp_list" :style="horseLampStyle">
           <ScrollItem
@@ -237,8 +221,9 @@ export default create({
         };
       } else {
         if (state.animate) {
+          let a = ~~(props.height / props.speed / 4);
           styles = {
-            transition: `all ${~~(props.height / props.speed / 4)}s`,
+            transition: `all ${a == 0 ? ~~(props.height / props.speed) : a}s`,
             'margin-top': `-${props.height}px`
           };
         }
@@ -306,10 +291,7 @@ export default create({
      */
     const startRollEasy = () => {
       showhorseLamp();
-      (state.timer as any) = setInterval(
-        showhorseLamp,
-        ~~(props.height / props.speed / 4) * 1000 + props.standTime
-      );
+      (state.timer as any) = setInterval(showhorseLamp, ~~((props.height / props.speed / 4) * 1000) + props.standTime);
     };
     const showhorseLamp = () => {
       state.animate = true;
@@ -317,7 +299,7 @@ export default create({
         state.scrollList.push(state.scrollList[0]);
         state.scrollList.shift();
         state.animate = false;
-      }, ~~(props.height / props.speed / 4) * 1000);
+      }, ~~((props.height / props.speed / 4) * 1000));
     };
 
     const startRoll = () => {