SOURCE

var newww = new Vue({
    'el': '#page',
    data() {
        return {
            godSon: '',
            nameArr: [ 
                {value: '陪啊琦逛街', key:'shopping', checked: true},    
                {value: '陪啊琦去图书馆', key:'lib', checked: true},    
                {value: '陪啊琦看电影', key:'camera', checked: true},    
                {value: '陪啊琦在家丸', key:'home', checked: true},  
            ],
            giftBtnBool: false,
            giftName:'点击下方按钮进行抽奖',
            giftNameIndex: -1,
            giftArr:['琦哥马杀鸡', '“贴身衣物”', '保暖内衣一套', '袜子一双', '琦哥免费剃头发', '书本','《三年模拟五年高考》','日历一个', '大头款式的礼物' ],
            timer:'',
            newArr: [],
            selectArr: [],
            lastNum: null
        }
    },
    methods:{
        setTimeGift(){
            for(let index in this.giftArr){
                console.log('item',this.giftBtnBool,Number(this.giftNameIndex), Number(this.giftArr.length)-1)
                if(Number(this.giftNameIndex) === Number(this.giftArr.length)-1) {
                    console.log('22')
                    this.giftNameIndex = -1
                }
                if(this.giftNameIndex !== index && this.giftNameIndex<index){
                    this.giftName = this.giftArr[index];
                    this.giftNameIndex = index;
                    break;
                }
            } 
        },
        randomGift(){
            this.giftBtnBool = !this.giftBtnBool;
            let inde;
            let _that = this
            if(this.giftBtnBool){
                this.timer =  setInterval(()=>{
                    this.setTimeGift()
                }, 100)
            }else{
                clearInterval(this.timer)
            }
        },
        randomName(){
            let filter = this.nameArr.filter(item =>{
                return item.checked
            })
            this.newArr = filter;
            let maxNum = filter.length;
            let minNum = 0;
            let a =parseInt(Math.random()*(maxNum-minNum+1)+minNum,10); 
           
            for(let i in filter){
                if(this.lastNum && this.lastNum == a){
                    continue;
                }
                if(i == a){
                  this.godSon = filter[i].value;
                    console.log('随机抽：'+ this.godSon)
                    this.lastNum = a;
                    return false;
                }
            }
        },
        checkInput(json){
            console.log(json.key);
            let arr = this.nameArr;
            arr.map(arrItem => {
                if(arrItem.key == json.key){
                    arrItem.checked = !json.checked
                }
            });
            this.nameArr = arr
        },
    },
    mounted(){
        

    }
})

<div id="page">
        <!-- <div v-for="item in nameArr">
            <label :for="item.key"  >
                <input type="checkbox" :id="item.key" :name="item.value" :checked="item.checked" @click="checkInput(item)">
                {{item.value}}
            </label>
        </div> -->
<div>
    <!-- <button @click="randomName">点击</button>
    周末去哪：{{godSon}}  -->

    <div class="gift">
        <span>将会抽到啥呢</span>
        <br>
        <div>{{giftName}}</div>
        <button @click="randomGift" v-text="giftBtnBool ? '结束' : '开始'" :class="giftBtnBool ? 'nowing' : ''"></button>
    </div>
</div>
        
</div>

.gift div{
    margin-top: 20px;
    color: blueviolet;
    font-size: 26px;
    font-weight: 600;
}
.gift span{
     color: #666;
    font-size: 18px;
    font-weight: 600;
}
.gift button{
    margin-top: 20px;
    padding: 6px 14px;
    background:#fff;
    outline: none;
    border:1px solid #999
}
.gift .nowing{
    background:#FFD700;
    border:1px solid #FFD700;
}