<template>
<div class='running_wrapper'>
<div class="content">
<div class="fix_content">
<div class="item-list">
<div
class="item"
v-for="(item, index) in dataList"
:key='index'
>
<img :src="item.userImg" alt="">
<div class="item_content">{
{ item.userName }}刚刚抢购了{
{ item.price }}元券</div>
</div>
<div
class="item"
v-for="(elem, ind) in lastArr"
:key='ind + dataList.length'
>
<img :src="elem.userImg" alt="">
<div class="item_content">{
{ elem.userName }}刚刚抢购了{
{ elem.price }}元券</div>
跑马灯 (消息轮播)vue实现
最新推荐文章于 2024-08-12 17:01:22 发布
本文介绍了如何使用Vue.js实现一个跑马灯效果,即消息轮播功能。通过在消息数组末尾追加首元素,当轮播至最后一个元素时,瞬间回跳至顶部,形成连续滚动的视觉效果。
摘要由CSDN通过智能技术生成