hcframe-doc/docs/02.前端/03.代码示例/01.Api示例.md

title, date, permalink

title	date	permalink
Api示例	2021-02-03 09:26:32	/pages/5c0128/

Api示例

::: tip 此处提供一个如何从后台调用接口的Api示例 :::

::: warning 注意 多个功能模块推荐创建多个api文件，方便代码维护 :::

1. 进入 src>api>api 文件夹中，创建一个文件，这里我们以UserApi.ts为例，并写入类的基本信息

   class UserApi{
   
   }
   
   export default UserApi
   

2. 引入封装好的 axios 并继承

   import BaseAxios from '@/common/http'
   
   class UserApi extends BaseAxios<any, any>{
   
   }
   
   export default UserApi
   

3. 根据后台接口文档写入需要请求的方法，注意请求方法

   import BaseAxios from '@/common/http'
   
   class UserApi extends BaseAxios<any, any>{
   
       // 根据用户id获取角色id
       public getRoleByUserId(param: any): Promise<Base.AxiosResponse<any>> {
           return this.axios.get('/ftUser/getRoleByUserId', param)
       }
   
       // 给用户添加角色
       public addRole(param: any): Promise<Base.AxiosResponse<any>> {
           return this.axios.post('/ftUser/addRole', param)
       }
   }
   
   export default UserApi