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)

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

你可能感兴趣的:(Vue——如何简单的生成随机数-Math.floor(Math.random()*3))