vue如何把接口单独存放在一个文件

最新推荐文章于 2024-01-10 18:34:34 发布

原创最新推荐文章于 2024-01-10 18:34:34 发布 · 6k 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#vue掉接口

本文详细介绍了如何在Vue项目中配置HTTP接口，包括创建httpConfig.js文件，定义接口URL，以及如何在组件中调用这些接口进行数据交互。

第一步：在src/router目录下，建立一个js文件（文件名：httpConfig.js）；

第二步：在httpConfig.js文件里面写上

const aa = 'http://192.168.1.123';//本地测试
const config = {
    bb: aa+ '/article/articleListPage',//所需的接口

}
//需要让外部拿到
export default config;

第三步：掉接口

_this.$http({
    url: _this.$httpConfig.bb,             //接口地址
    method: 'POST',                        //请求方式
    contentType: "application/json;",      //内容类型
    headers: {
        'Content-Type': 'application/json' //请求头
    },
    dataType: "json",                      //数据格式
    async: false,                          //设置同步/异步
    data: {
                                           //所需参数
    },
}).then(function(response) {
    console.log(response.data);            //打印成功信息
}, function(error) {
    console.log(error);                    //打印错误信息
});