直播间赠送礼物动效、选礼物列表、赠送数量，礼物连发排队处理，Vue项目

 

1、可以选择送的是礼物列表的哪一个、可以选择送的数量x1x2x3
2、礼物做了排队展示的处理，可以解决礼物连续发送、监听到别人发送礼物接口数据回调的排队问题，不会冲刷掉礼物动效

下面是一个完整的送礼物动效页，可以直接copy到vue项目运行打开

<template>
  <div>
    <div class="test_box" v-if="giftAnimation">
      <img v-if="showGiftList.length" :src="showGiftList[0].giftImage" alt="">
      你赠送{
  {showGiftList.length ? showGiftList[0].liveGiftName : ''}}
    </div>
    
    <h1>当前排队的礼物长度{
  {showGiftList.length}}</h1>
    <div class="btn_box">
      <button v-for="(item,itemI) in allList" :key="itemI" @click="giftParams.giftIndex = itemI"> {
  {item.liveGiftName}}</button>
      &