React的API
2023-09-14 09:14:05 时间
API定义类似于Vue的API
/**
* 这里就类似于Vue的api,这些api将在pages的各模块models引入
* 也是与调用后端的URI相匹配的
*/
import { async } from "q";
// 引入request请求工具,Vue中同样也对request做了封装
import request, { download } from '@/utils/request';
import qs from 'qs';
// 这样定义可重用方便维护
const API_BASE = "/antdsp-api";
const USER_API = API_BASE + "/system/user";
const MENU_API = API_BASE + "/system/menu";
const ROLE_API = API_BASE + "/system/role";
export async function fetchAllUser(params){
return request(`${USER_API}?${qs.stringify(params, { indices: false })}`);
}
/**
* 添加用户
*
* URI = URI前缀(较固定,与后端mapping相匹配) + method(POST、PUT、DELETE、GET) + data
* 最基本的必须有 URI前缀
*
* @param params 参数
* @returns {Promise<void>}
*/
export async function addUser(params){
return request(`${USER_API}`,{
method: 'POST',
data:{
...params
}
});
}
export async function updateUser(params){
const userId = params.user.id;
return request(`${USER_API}/${userId}`,{
method: 'PUT',
data:{
...params
}
});
}
export async function delUserById(params){
return request(`${USER_API}/${params.id}`,{
method: 'DELETE',
});
}
export async function fetchUser(params){
return request(`${USER_API}/${params.id}`,{
method: 'GET'
});
}
export async function fetchAllMenu(){
return request(`${MENU_API}`)
}
export async function addMenu(params){
return request(`${MENU_API}`,{
method: 'POST',
data:{
...params
}
});
}
export async function updateMenu(params){
return request(`${MENU_API}`,{
method: 'PUT',
data:{
...params
}
});
}
export async function delMenuById(param){
return request(`${MENU_API}/${param.id}`,{
method: 'DELETE',
})
}
export async function fetchAllRole(param){
return request(`${ROLE_API}?${qs.stringify(param, { indices: false })}`)
}
export async function addRole(params){
return request(`${ROLE_API}`,{
method: 'POST',
data: {
...params
},
})
}
export async function updateRole(params){
return request(`${ROLE_API}`,{
method: 'PUT',
data: {
...params
}
});
}
export async function delRoleById(param){
return request(`${ROLE_API}/${param.id}`,{
method: 'DELETE'
})
}
export async function fetchRoleById(param){
return request(`${ROLE_API}/${param.id}`);
}
export async function queryRoles(){
return request(`${ROLE_API}/queryRoleNameAndIds`);
}
export async function queryRoleMenus(){
return request(`${MENU_API}/route`);
}
export async function fetchAllLog(param){
return request(`${API_BASE}/operation/log?${qs.stringify(param, { indices: false })}`);
}
export async function exportLog(params){
return download(`${API_BASE}/operation/log/export?${qs.stringify(params, { indices: false })}`)
}
相关文章
- react 移动端 兼容性问题和一些小细节
- ABP源码分析三十七:ABP.Web.Api Script Proxy API
- 一统江湖的大前端React.js-从开发者到工程师
- [React] useEffect - problem: depending On State Mutated In The useEffect
- [React] Using react-styleguidist for Component demo
- [Node.js] Mock an API for Local Development in React with Mirage JS
- [React Testing] Test Drive Mocking react-router’s Redirect Component on a Form Submission
- [React] Understand the React Hook Flow
- [React] Ensure all React useEffect Effects Run Synchronously in Tests with react-testing-library
- [React] Render Elements Outside the Current React Tree using Portals in React 16
- [React Intl] Format Numbers with Separators and Currency Symbols using react-intl FormattedNumber
- [React] Create a Virtualized List with Auto Sizing Cells using react-virtualized and CellMeasurer
- [React] Create an Auto Resizing Virtualized List with react-virtualized
- [React Router v4] Render Nested Routes
- [React + webpack] hjs-webpack
- 根据《Build your own React》实现简易React
- [React Typescript 2022] Use TypeScript to Type a React Class Component
- [React] Use the React Context API to Globally Manage State
- [React Native] Dismiss the Keyboard in React Native
- [React] Make Controlled React Components with Control Props
- [React Intl] Use a react-intl Higher Order Component to format messages
- [React] Create an Auto Resizing Virtualized List with react-virtualized
- 利用 Jest 测试 React 组件
- react获取当前页面的url参数
- 201-React顶级API
- React(一)react概述、组件、事件
- 【taro react hooks 错误解决】---- Warning: Can‘t perform a React state update on an unmounted component.
- Taro React组件使用(1) —— Overlay 遮罩层【渐入渐出动画遮罩层】