vue项目中抽离API调用接口

最新推荐文章于 2023-04-23 13:35:13 发布

_MadD

最新推荐文章于 2023-04-23 13:35:13 发布

阅读量1.5k

点赞数 3

CC 4.0 BY-SA版权

分类专栏： # vue基础知识文章标签： vue.js

本文链接：https://blog.youkuaiyun.com/weixin_45849112/article/details/108133191

本文介绍了如何在Vue.js项目中组织和抽离API调用接口，将接口请求文件按页面分别存放在src/api目录下，如member.js。在实际使用时，可在对应的页面组件中导入并使用这些接口文件，提高代码的可维护性和组织性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在 src/api 下创建每个页面的api请求文件，例如：
在 src/api 下创建 member.js , 调用接口代码如下:

import request from '@/utils/request'

export default {
   
   
    // 获取会员列表数据
    getList() {
   
   
        return request({
   
   
            url: '/member/list',
            method: 'get'
        })
    },

    // 分页搜索方法
    // page 当前页码, size每页查询条数, searchMap条件查询的条件值
    search(page, size, searchMap) {
   
   
        return request({
   
   
            url: `/member/list/search/${
     
     page