fix(notice-bar): adjust scrollable behavior (#4201)

packages/notice-bar/README.md

@@ -102,7 +102,7 @@
 | left-icon | 左侧[图标名称](#/icon)或图片链接 | _string_ | - |
 | delay | 动画延迟时间 (s) | _number_ | `1` |
 | speed | 滚动速率 (px/s) | _number_ | `50` |
-| scrollable | 是否开启滚动播放，内容长度溢出时默认开启 | _boolean_ | `true` |
+| scrollable | 是否开启滚动播放，内容长度溢出时默认开启 | _boolean_ | - |
 | wrapable | 是否开启文本换行，只在禁用滚动时生效 | _boolean_ | `false` |
 | open-type | 微信开放能力 | _string_ | `navigate` |
 

packages/notice-bar/index.ts

@@ -29,10 +29,7 @@ VantComponent({
       value: 50,
       observer: 'init',
     },
-    scrollable: {
+    scrollable: null,
-      type: Boolean,
-      value: true,
-    },
     leftIcon: {
       type: String,
       value: '',
@@ -70,17 +67,17 @@ VantComponent({
           getRect(this, '.van-notice-bar__wrap'),
         ]).then((rects) => {
           const [contentRect, wrapRect] = rects;
+          const { speed, scrollable, delay } = this.data;
           if (
             contentRect == null ||
             wrapRect == null ||
             !contentRect.width ||
-            !wrapRect.width
+            !wrapRect.width ||
+            scrollable === false
           ) {
             return;
           }
 
-          const { speed, scrollable, delay } = this.data;
-
           if (scrollable || wrapRect.width < contentRect.width) {
             const duration = (contentRect.width / speed) * 1000;
 

packages/notice-bar/index.wxml

@@ -16,7 +16,7 @@
   <slot wx:else name="left-icon" />
 
   <view class="van-notice-bar__wrap">
-    <view class="van-notice-bar__content {{ !scrollable && !wrapable ? 'van-ellipsis' : '' }}" animation="{{ animationData }}">
+    <view class="van-notice-bar__content {{ scrollable === false && !wrapable ? 'van-ellipsis' : '' }}" animation="{{ animationData }}">
       {{ text }}
       <slot wx:if="{{ !text }}"></slot>
     </view>