vue 中在子页面中使用watch监听父页面数据而导致接口多次调用

vue 中在子页面中使用watch监听父页面数据而导致接口多次调用

解决方式 debounce

function debounce(func, delay) {
   let timerId;

   return function(...args) {
      clearTimeout(timerId);
      timerId = setTimeout(() => {
         func.apply(this, args);
      }, delay);
   };
}

watch中

watch:{
	监听值: {
      handler: debounce(function(val) {
	        // val为监听的的新值
	        // 此处调用接口
			this.#####()
      }, 500),
      deep: false,
      immediate: false,
   },
}