vue 文字无缝滚动_详解vue 自定义marquee无缝滚动组件

先上效果图：

(1) 看起来可能有点卡顿，但是实际上页面上看起来挺顺畅的。

(2) 思路就是获取每一个列表的宽度，设置定时器移动列表，当移动的距离达到一个列表的宽度的时候，把这个距离放到数组的最后。这样就能达成无缝循环滚动了。

大致的情况就是下面这样：

接下来就是代码的实现：

index.vue 引入组件

import marqueeleft from '../components/marquee'

export default {

data:function(){

return{

send:[{place: "来自东莞市的", name: "黄女士"},

{place: "来自太原市的", name: "吴先生"},

{place: "来自常州市的", name: "戚先生"},

{place: "来自金华市的", name: "尤先生"},