Vue makes a simple random roll call

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

 <script>
        let vm = new Vue({
            el:'#app',
            data:{
                list:["Xiaoyi","Lier","Wangsan","Saturday","Zhangwu"],
                // Randomly named content result:'',
                //Button text content txt: "Start roll call",
                // Process control switch open: true,
                // Define the timer switch timer:null
            },
            methods: {
                move(){
                    // Get a random number between 0 and the length of the current array let random = Math.floor(Math.random()*(this.list.length-0))
 
                    // Let the random number become the random subscript of the list array, assign it to result, and render it on the page this.result = this.list[random]
                },
                randomName(){
                    // Process control switch if(this.open){
                        // Define the timer and call the move method this.timer = setInterval(this.move,100)
                        this.txt = "Stop calling names"
                        this.open = false
                    }else{
                        // Clear the timer clearInterval(this.timer)
                        this.txt = "Start roll call"
                        this.open = true
                    }
                }
            }
        })
    </script>