SOURCE

var app = new Vue({
  el: '#app',
  data: {
    level: '低',
    num: 3,
    time: 2000,
    levelList: ['低', '中', '高'],
    numList: [1, 2, 3, 4, 5, 6, 7],
  },
  methods: {
    pick(list) {
      return list[Math.floor(Math.random() * list.length)];
    },
    startTimer(fn) {
      clearInterval(this.timer);
      this.timer = setInterval(fn, this.time);
    },
    update() {
      let prevValue = [this.level, this.num];
      let level = this.pick(this.levelList);
      let num = this.pick(this.numList);
      this.level = level;
      if (level === '低') {
        this.num = Math.max(num, 3);
      } else if (level === '高') {
        this.num = Math.min(num, 5);
      }

      if (prevValue[0] === this.level && prevValue[1] === num) {
        this.update();
      }
    },
    updateTimer() {
      this.startTimer(this.update, this.time);
    }
  },
  watch: {
    time() {
      this.updateTimer();
    }
  },
  mounted() {
    this.updateTimer();
  }
})

<div id="app">
  <h1>
    <span>
      {{ level }}
    </span>
    {{num}}
  </h1>
  <input type="text" v-model="time" />
  <select v-model="time">
    <option value='1000'>
      1
    </option>
    <option value='2000'>
      2
    </option>
    <option value='3000'>
      3
    </option>
    <option value='4000'>
      4
    </option>
    <option value='5000'>
      5
    </option>
  </select>
</div>

select,
input {
  font-size: 18px;
  margin-right: 10px;
  padding: 4px;
}