SOURCE

console 命令行工具 X clear

                    
>
console
var newww = new Vue({
    'el': '#page',
    data() {
        return {
            godSon: '',
            nameArr: [
                {value: '慧敏', key:'huimin', checked: true},    
                {value: '诗颖', key:'shiying', checked: true},    
                {value: '映彤', key:'yingtong', checked: true},    
                {value: '陈雅', key:'chenya', checked: true},    
                {value: '家伦', key:'jialun', checked: true}, 
                {value: '祥发', key:'xianfa', checked: true},     
                {value: '彦博', key:'yanbo', checked: true},
                {value: '金梁', key:'jingliang', checked: true},
                {value: '康杰', key:'kangjie', checked: true},
                {value: '郭涵 ', key:'guohan', checked: true},
            ],
            newArr: [],
            selectArr: [],
            lastNum: null
        }
    },
    methods:{
        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
        },
    },
})
<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>
{{selectArr}}
    <div>
        <button @click="randomName">点击</button>
        天选之子:{{godSon}} 
    </div>
</div>

本项目引用的自定义外部资源