文字超出滚动 uni-app组件

一、预览图

文字超出滚动.gif

二、实现的点

1.文字超出父元素宽度，自动滚动
2.文字不超出父元素宽度，不滚动
3.自动计算滚动时间，控制滚动速度
4.兼容H5、小程序

三、实现代码

components/textScroll/index.vue 组件代码如下：

四、使用教程

• vue页面使用

import textScroll from '@/components/textScroll/index.vue'
export default {
    components: { textscroll },
    data() {
        return {
                boardRemark: '很长很长很长很长很长很长很长很长很长很长很长很长的文字'
      }
   }
}