vue节流防抖

<template>
    <div>
        <el-form :model="dataForm">
            <el-input size="mini" v-model="dataForm.budgetprojectname"></el-input>
        </el-form>
    </div>
</template>
<script>
    export default {
        data () {
            return {
                dataForm: {},
                timeID:null,  //  定时器
        },
        watch: {
            dataForm:{
                handler(val, oldVal){
                    this.autoSave()
                  },
                  deep:true //true 深度监听
            }
        },
        methods: {
            /**
            *        为防止监听时   多次发送请求   使用防抖/节流
            *        防抖:    将多次执行变为最后一次执行
            *        节流:   将多次执行变为每隔一段时间执行
            */    
            autoSave(val, oldVal){
              if(this.timeID){    
                clearTimeout(this.timeID)   //   清除定时器 
              }
                this.timeID=setTimeout(()=>{     //   定时器
                  console.log('防抖');
                  this.RealTime()   
                },30000)     //   操作结束后30秒  发送axios请求
            },
            // 自动保存
            RealTime(){
                //   发送axios请求
            }
        }
    }
</script>