圈子系统APP小程序H5，免费开源，允许二开。

。

从后台进入前台显示

onShow() {

this.flyLeftList=[];

this.flyCenterList=[];

this.flyRightList=[];

this.refreshUser();

},

点击查看完整免费开源，允许二开

// 从前台进入后台

onHide() {

this.flyLeftList=[];

this.flyCenterList=[];

this.flyRightList=[];

clearInterval(this.interval);

},

methods:{

showMan(){

console.log('========')

this.show =true

},

refreshUser(){

this.flyInterval();

},

flyInterval() {

if(this.interval != null){

clearInterval(this.interval);

}

var t = this;

this.pushFlyList(),

this.interval = setInterval((function() {

t.pushFlyList()

}

), 1e3 * this.intervalTime)

},

pushFlyList() {

var t = 0;

while (t < 3) {

this.indexRecord == this.userList.length - 1 ? this.indexRecord = 0 : this.indexRecord++;

var a = this.userList[this.indexRecord];

switch (t) {

case 0:

this.flyLeftList.push(a);

break;

case 1:

this.flyCenterList.push(a);

break;

case 2:

this.flyRightList.push(a);

break

}

t++

}

},

}

}

</script>

<style lang="scss">

page{

height: 100%;

background: url('~@/static/imgs/home/bg.png');

}

.match-button{

background-image: linear-gradient(to top, #c471f5 0%, #fa71cd 100%);

color: #ffff;

border-radius: 100rpx;

padding: 20rpx;

}

.center {

height: 100%;

flex: auto;

display: flex;

flex-direction: column;

justify-content: center;

align-items: center;

//background-color: red;

}

@keyframes warn {

0% {

transform: scale(0.3);

-webkit-transform: scale(0.3);

opacity: 0.0;

}

25% {

transform: scale(0.3);

-webkit-transform: scale(0.3);

opacity: 0.1;

}

50% {

transform: scale(0.5);

-webkit-transform: scale(0.5);

opacity: 0.3;

}

75% {

transform: scale(0.8);

-webkit-transform: scale(0.8);

opacity: 0.5;

}

100% {

transform: scale(1);

-webkit-transform: scale(1);

opacity: 0.0;

}

}

@keyframes warn1 {

0% {

transform: scale(0.3);

-webkit-transform: scale(0.3);

opacity: 0.0;

}

25% {

transform: scale(0.3);

-webkit-transform: scale(0.3);

opacity: 0.1;

}