关于javascript:select下拉框change事件中设置定时器

11次阅读

共计 680 个字符，预计需要花费 2 分钟才能阅读完成。

先来看一张图片，说一下需要

要求是选中秒数，定时刷新列表，间接上代码吧

<span> 定时刷新：</span>
<el-select
    v-model="refres"
    placeholder="请抉择"
    size="small"
    @change="shuaxin"
   >
     <el-option
      v-for="item in refresh"
      :key="item.value"
      :label="item.label"
      :value="item.value"
     >
     </el-option>
</el-select>
export default {data () {
      return {
        refresh: [{
          value: '1',
          label: '30 秒'
        }, {
          value: '2',
          label: '1 分钟'
        }, {
          value: '6',
          label: '3 分钟'
        }, {
          value: '10',
          label: '5 分钟'
        }],
        refres: '1',
        timer: null, // 定时器的名字
      }
    }
}

上面开始写办法

methods: {shuaxin (v) {
      // 每次定时器开启前  先革除之前的定时器
      if (this.timer) {clearInterval(this.timer)
      }
      this.timer = setInterval(() => {
        // 获取列表
        console.log('这是最新的')
        this.getList()}, Number(v) * 30000)
    }
},
// 当然别忘了在页面销毁的时候革除定时器
destroyed () {clearInterval(this.timer)
},

以上就是 select 下拉框 change 事件中设置定时器的做法了，哪里有问题欢送指导

正文完