请求
const handldeComfirmTermwork = async (params) => { // async 异步函数标识
try { //捕获错误信息
const { id, sid, label } = params // 解构赋值
const res = await comfirmTermwork({ id, sid, label }) // 发送请求
if (res.code === 0) {
message.success('操作成功') //提示成功
PageStore.getPageList() //mobx刷新列表(数据变化,react是如何刷新的)
} else {
message.error(get(res, 'message', '接口返回数据异常'))
}
} catch (error) {
message.error(error || '请求异常')
}
}
url中参数的处理方式
在React中获取url中的参数可以使用window.location.search属性得到。这个属性返回一个以问号(?)开头的字符串,这个字符串包含了url中的查询参数部分。可以利用解析URL查询字符串的方法来提取查询参数。以下是一个示例:
javascript
function getQueryParam(name) {
const search = window.location.search;
const urlParams = new URLSearchParams(search);
return urlParams.get(name);
}
// 获取名为'id'的查询参数
const id = getQueryParam('id');
console.log(id);
这个函数使用了URLSearchParams对象来解析URL查询字符串,并且提供了一个getQueryParam函数来获取指定名称的查询参数。比如,上述例子中的getId('id')函数将返回查询参数id的值。
注意,在使用window.location.search时,需要确保当前页面的URL是包含查询参数的。
URLSearchParams 是一个 JavaScript 内置对象,它可以用来处理 URL 查询参数的类。它提供了一组方法,用于添加、获取、删除、替换 URL 查询参数。
使用 URLSearchParams 对象,你可以方便地从 URL 查询字符串中提取查询参数,也可以动态创建和修改查询字符串。下面是一些常用的方法:
append(name, value):添加一个带有指定名称和值的新搜索参数。
delete(name):从搜索参数列表中删除指定名称的第一个搜索参数。
get(name):返回指定搜索参数的第一个值。
getAll(name):返回指定搜索参数的所有值。
has(name):如果搜索参数列表中存在指定名称的搜索参数,则返回 true。
set(name, value):将指定名称的第一个搜索参数替换为指定值。如果未找到指定名称的搜索参数,则追加一个带有指定名称和值的新搜索参数。
以下是一个简单的示例:
javascript
const params = new URLSearchParams('?name=john&age=30');
params.append('language', 'javascript');
params.set('age', '40');
console.log(params.toString()); // name=john&age=40&language=javascript
console.log(params.get('age')); // 40
console.log(params.has('gender')); // false
在这个例子中,我们创建了一个新的 URLSearchParams 对象,并向其添加了一些 URL 查询参数。 params.toString() 方法返回一个包含查询参数的字符串形式。 我们还使用 get 和 has 方法来检索查询参数,使用 append 和 set 进行修改。
是的,有一些第三方库可以方便地处理URL查询参数,以及在React中获取url中的查询参数。以下是一些常用的库:
qs:一个简单的字符串化和解析 URL 查询字符串的库,支持解析数组和嵌套对象,同时也支持基本的 URL 编码和解码。 qs 的文档地址:https://github.com/ljharb/qs
query-string:一个轻量级的解析和串化查询字符串的库,提供了与 qs 相似的 API,它的文档地址:https://github.com/sindresorhus/query-string
这些库可以使从URL中提取查询参数变得更加简单方便。不过如果只需要处理简单的URL查询参数,使用原生的URLSearchParams对象通常足够了。