在 Axios 请求上使用 Lodash 的 Debounce 会产生意想不到的结果

Posted 2023-02-22

【中文标题】在 Axios 请求上使用 Lodash 的 Debounce 会产生意想不到的结果

【英文标题】：Using Lodash's Debounce on Axios Request Produces Unexpected Result

【发布时间】：2017-02-10 02:43:32

【问题描述】：

每次输入文本时，我的应用都会更新。然后在 axios 请求上使用 debounce，请求排队，直到计时器用完，然后它们都立即执行。我试图将请求限制为每 10 秒一个。我哪里错了？

如果有后果，我会在 ReactJS 中执行此操作。

const debouncedSync = _.debounce(() => this.sync () , 10000);

sync = (requestBody) => 
    axios.post('http://127.0.0.1:8000/Server/', requestBody);
  ;

【问题讨论】：

"我试图将请求限制为每 10 秒一次" 那将是 _.throttle() 而不是 _.debounce()。除此之外，真正的问题是什么？

好吧，这很清楚。除此之外，唯一的问题是我还是个新手。非常感谢！如果您将其作为答案提交，我会将其标记为已接受。

【参考方案1】：

请查看faxios debounce

let fetcher = faxios()
.baseURL('http://jsonplaceholder.typicode.com')
.url('posts', 1, 'comments')
.debounce(1 * 1000); // debounce time 1000ms

fetcher
.FETCH // => Promise
.then(res => console.log('res1:',res))
.catch(err => console.log('error1:', err));

fetcher
.FETCH // => Promise
.then(res => console.log('res2:', res))
.catch(err => console.log('error2:', err));

fetcher
.FETCH // => Promise
.then(res => console.log('res3:',res))
.catch(err => console.log('error3:', err));

fetcher
.FETCH // => Promise
.then(res => console.log('res4:', res))
.catch(err => console.log('error4:', err));


/**

error1:debounced

error2:debounced

error3:debounced

res4:... 

**/