<template>
<div class="pageBgc" @click="changeBgc" :style="{background:colorIndex}">
<ul>
<li>点我切换颜色</li>
</ul>
</div>
</template>
<script>
export default {
data() {
return {
colorSet : ['gold','skyblue','red'],
colorIndex:0
};
},
methods: {
changeBgc(){
let colorRender = Math.floor(Math.random() * this.colorSet.length); //随机数
this.colorIndex = this.colorSet[colorRender]; //拿到数组里的颜色
}
},
};
</script>
<style scoped lang="less">
.pageBgc{
width: 100%;
height: 100vh;
background: skyblue;
}
</style>
?
