Vue实现简单的接口封装

  1. 在src中创建一个api文件夹
  1. 按功能、模块等新建对应的js文件
  1. 在内部写对应的封装接口,并导出
javascript 复制代码
import axios from "axios";

/**
 * 接口名称:
 * 接收参数:
 * 返回参数:
 * 
 */

export const miens =()=>{
     return new Promise ((resolve)=>{
        axios({
            url:"/webapi/index/index",
            method:"post",
            params:{},
        }).then((res)=>{
            resolve(res);
        });
        });
     };
  1. 在需要使用的页面带入使用即可
javascript 复制代码
import { miens} from '../api/admin'

miens().then(res => {
    console.log(res);
})

原创作者:吴小糖

创作时间:2023.10.10

相关推荐
雨季6662 分钟前
Flutter 三端应用实战:OpenHarmony “心流之泉”——在碎片洪流中,为你筑一眼专注的清泉
开发语言·前端·flutter·交互
换日线°6 分钟前
前端3D炫酷展开效果
前端·3d
广州华水科技13 分钟前
大坝变形监测的单北斗GNSS技术应用与发展分析
前端
Dontla18 分钟前
浏览器localStorage共享机制介绍(持久化客户端存储方案)本地存储冲突、iframe、XSS漏洞、命名空间隔离
前端·网络·xss
●VON21 分钟前
React Native for OpenHarmony:构建高性能、高体验的 TextInput 输入表单
javascript·学习·react native·react.js·von
●VON26 分钟前
React Native for OpenHarmony:ActivityIndicator 动画实现详解
javascript·学习·react native·react.js·性能优化·openharmony
霍理迪33 分钟前
JS其他常用内置对象
开发语言·前端·javascript
tao35566735 分钟前
HTML-03-HTML 语义化标签
前端·html
小马_xiaoen38 分钟前
IndexedDB 从入门到实战:前端本地大容量存储解决方案。
前端
jiayong2342 分钟前
Vue2 与 Vue3 常见面试题精选 - 综合宝典
前端·vue.js·面试