axios 取消token 模糊搜索

import axios from 'axios';

// 创建一个取消令牌源(cancel token source)

const CancelToken = axios.CancelToken;

const source = CancelToken.source();

// 下拉框搜索函数

function search() {

// 获取输入值

const inputValue = document.getElementById('searchInput').value;

// 发起请求前取消上一个请求(如果还没有完成)

source.cancel('取消上一个请求');

// 创建新的取消令牌

const newSource = CancelToken.source();

// 将新令牌赋值给全局变量 source,以便于下次取消

source = newSource;

// 发起新的请求,并使用新的取消令牌

axios.get('你的搜索API', {

params: {

search: inputValue

},

cancelToken: source.token

})

.then(response => {

// 处理响应数据

console.log(response.data);

})

.catch(thrown => {

if (axios.isCancel(thrown)) {

console.log('上一个请求已被取消:', thrown.message);

} else {

// 处理其他错误

console.error(thrown);

}

});

}

// 绑定输入框的事件

document.getElementById('searchInput').addEventListener('input', search);

相关推荐
apcipot_rain7 小时前
C++转Java日记(04)
java·开发语言·c++
红尘散仙7 小时前
谁说终端只能敲键盘?我用 Rust 给小说阅读器加上了鼠标
前端·后端·rust
Penge6667 小时前
《Go 后端开发者学 React:组件通信与插槽》
javascript
陈随易8 小时前
C++26 草案被否,二十八年来头一回
前端·后端·程序员
ZhengEnCi8 小时前
Agent 工具怎么折叠海量输出才「爽」:Trae、Claude Code 的渐进式披露设计原理
前端·agent
云和数据.ChenGuang8 小时前
LangGraph 异步 Node 的设计与写法实践
开发语言·人工智能·python·机器学习·php
Penge6669 小时前
《Go 后端开发者学 React:useState》
javascript
Penge6669 小时前
《Go 后端开发者学 React:数据渲染》
javascript
蜗牛一步步往上爬12 小时前
第十六章 C++语言在深度学习中的应用
开发语言·c++·深度学习
IT_陈寒12 小时前
Redis内存暴涨,没想到是AOF重写捣的鬼
前端·人工智能·后端