<div id="app">
        <p>{{result}}</p>
        <button @click="randomName()">{{txt}}</button>
    </div>

 <script>
        let vm = new Vue({
            el:'#app',
            data:{
                list:["小一","李二","王三","周四","張五"],
                // 隨機點名的內(nèi)容
                result:'',
                // 按鈕文本內(nèi)容
                txt:"開始點名",
                // 流程控制開關(guān)
                open:true,
                // 定義計時器開關(guān)
                timer:null
            },
            methods: {
                move(){
                    // 獲取一個 0-當(dāng)前數(shù)組長度的隨機數(shù)
                    let random = Math.floor(Math.random()*(this.list.length-0))
 
                    // 讓隨機數(shù)成為 list數(shù)組的隨機下標(biāo)，賦值給 result ，在頁面渲染
                    this.result = this.list[random]
                },
                randomName(){
                    // 流程控制開關(guān)
                    if(this.open){
                        // 定義計時器，調(diào)用move方法
                        this.timer = setInterval(this.move,100)
                        this.txt = "停止點名"
                        this.open = false
                    }else{
                        // 清除計時器
                        clearInterval(this.timer)
                        this.txt = "開始點名"
                        this.open = true
                    }
                }
            }
        })
    </script>