Vue——如何简单的生成随机数-Math.floor(Math.random()*3)

Math.floor(Math.random()*3)

    new Vue({
        el:'#root',
        data:{
            name:'小巫医初春',
            mood:'normal'
        },
        methods:{
            changeMood(){
                const arr = ['happy','sad','normal']
                this.mood = arr[Math.floor(Math.random()*3)]
            }
        },
    })

<div id="root">
    <div :class="mood" @click="changeMood">{{name}}</div>
</div>

以上代码是通过点击div随机赋予一种样式

重点是这里this.mood = arr[Math.floor(Math.random()*3)]

代码：Math.random() 表示生成一个[0,1)的随机数字，不会出现1，而在我们的数组中只有0-2

所以需要乘以3：Math.random()*3，这样我们得到的数字是0.xxx，1.xxx，2.xxx

然后我们只需要取小数点前的数字Math.floor(Math.random()*3)

这样一个简单的随机数生成就完成了。