用VUE 写一个随机抽奖的功能加好看的页面

好的，下面是一个简单的示例代码，用 Vue 实现随机抽奖功能：

<template>
  <div>
    <h1>随机抽奖</h1>
    <button @click="start">开始抽奖</button>
    <ul>
      <li v-for="(item, index) in list" :key="index">{{ item }}</li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      list: ["奖品1", "奖品2", "奖品3", "奖品4", "奖品5", "奖品6"],
      intervalId: null,
      selected: null,
      finished: false,
    };
  },
  methods: {
    start() {
      if (this.finished) {
        this.list.push(this.selected);
        this.selected = null;
        this.finished = false;
      }
      this.intervalId = setInterval(() => {
        let index = Math.floor(Math.random() * this.list.length);
        this.selected = this.list[index];
      }, 50);
      setTimeout(() => {
        clearInterval(this.intervalId);
        this.finished = true;
      }, 3000);
    },
  },
};
</script>

上面的代码实现了一个简单的随机抽奖，当用户点击“开始抽奖”按钮时，页面会开始随机选取奖品，持续 3 秒钟，最后停止在一个奖品上。

接下来，你可以通过 CSS 美化页面，使其更加好看，例如添加动画效果、更改字体颜色等等。