Notice Bar 通知栏

介绍

用于循环播放展示一组消息通知。

引入

"usingComponents": {
  "m-notice-bar": "mind-ui-weapp/notice-bar/index"
}

示例

基础用法

<m-notice-bar>
	练得身形似鹤形，千株松下两函经。
	我来问道无馀说，云在青霄水在瓶。
	选得幽居惬野情，终年无送亦无迎。
	有时直上孤峰顶，月下披云啸一声。
</m-notice-bar>

内容超出不滚动

<m-notice-bar scrollable="{{ false }}">
  练得身形似鹤形，千株松下两函经。
  我来问道无馀说，云在青霄水在瓶。
  选得幽居惬野情，终年无送亦无迎。
  有时直上孤峰顶，月下披云啸一声。
</m-notice-bar>

多行显示

<m-notice-bar multiline>
  练得身形似鹤形，千株松下两函经。
  我来问道无馀说，云在青霄水在瓶。
  选得幽居惬野情，终年无送亦无迎。
  有时直上孤峰顶，月下披云啸一声。
</m-notice-bar>

自定义两端内容

<m-notice-bar>
  <view class="preifx" slot="preifx">
    <m-icon name="notice" size="{{36}}" color="#ed6a0c" />
  </view>

  <view>
    练得身形似鹤形，千株松下两函经。
    我来问道无馀说，云在青霄水在瓶。
    选得幽居惬野情，终年无送亦无迎。
    有时直上孤峰顶，月下披云啸一声。
  </view>

  <view class="suffix" slot="suffix">
    <m-icon name="close" size="{{36}}" color="#ed6a0c" />
  </view>
</m-notice-bar>

properties

参数	说明	类型	可选值	默认值
speed	滚动速率 (rpx/s)	Number	—	100
delay	动画延迟时间 (s)	Number	—	1
scrollable	是否在长度溢出时滚动播放	Boolean	—	true

Slot

名称	说明
preifx	自定义前缀
-	通知内容
suffix	自定义后缀