uniapp 微信小程序 封装公共的请求js(api版本)

一、新建api文件夹
在项目目录下创建api文件夹,内放files跟index.js文件夹,files文件夹内放每个页面对应的js请求接口
在这里插入图片描述
1、index.js

/*** api接口的统一出口*/
const api = {};
const requireComponent = require.context('./files', false, /\.js$/)
requireComponent.keys().forEach(fileName => {const componentName = fileName.replace(/^\.\/(.*)\.\w+$/, '$1')const componentConfig = requireComponent(fileName)api[componentName] = componentConfig.default
})
export default api;

2、例如:login.js

/*** 登录用到的接口*/
import http from '@/utils/http.js'
import config from '@/utils/config.js'
const login = {//角色001-账号登录transportLogin(data){return new Promise((resolve, reject) => {http.request({domain:config.adminDomain,//接口ip地址+端口号(第一种)url: "/user/login",method: "POST",data,callBack: res => {resolve(res);}})})},//角色002-账号登录regulatorLogin(data){return new Promise((resolve, reject) => {http.request({domain:config.domain,//接口ip地址+端口号(第二种)url: "/wx/login",method: "POST",data,callBack: res => {resolve(res);}})})}
}
export default login;

二、config.js

const domain = "http://192.888.888.6:80/my"
const adminDomain = "http://192.888.444.9:800"
const adminH5 = "http://192.888.666.7:82/#";
module.exports = {domain,adminDomain,adminH5
}

三、main.js
在这里插入图片描述

四、页面使用

<template><view class="login-btn" @click="toLogin">登录</view><view class="login-btn" @click="toLogin2">登录</view>
</template>
methods: {toLogin(){this.$api.login.transportLogin(data).then(res=>{uni.hideLoading()if (res.code === 200) {// 保存登陆信息uni.setStorageSync('loginResult', res)uni.setStorageSync('token', res.token);uni.setStorageSync('login',false);uni.reLaunch({url: "/pages/learning/learning"})}})},toLogin2(){let data = {account: "", //用户名pwd: "" //密码};this.$api.login.regulatorLogin(data).then(res=>{uni.hideLoading()if (res.code === 200) {// 保存登陆信息uni.setStorageSync('loginResult', res)uni.setStorageSync('token', res.token);uni.setStorageSync('login',false);uni.reLaunch({url: "/pages/learning/learning"})}})}
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/31914.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

SpringCloud实用篇2——Nacos配置管理 Feign远程调用 Gateway服务网关

目录 1 Nacos配置管理1.1 统一配置管理1.1.1 在nacos中添加配置文件1.1.2 从微服务拉取配置 1.2 配置热更新1.2.1 方式一1.2.2 方式二&#xff08;推荐&#xff09; 1.3.配置共享 2 搭建Nacos集群2.1 集群结构图2.2 搭建集群2.2.1 初始化数据库2.2.2 下载nacos2.2.3 配置Nacos2…

竞赛项目 深度学习的智能中文对话问答机器人

文章目录 0 简介1 项目架构2 项目的主要过程2.1 数据清洗、预处理2.2 分桶2.3 训练 3 项目的整体结构4 重要的API4.1 LSTM cells部分&#xff1a;4.2 损失函数&#xff1a;4.3 搭建seq2seq框架&#xff1a;4.4 测试部分&#xff1a;4.5 评价NLP测试效果&#xff1a;4.6 梯度截断…

面部表情识别4:C++实现表情识别(含源码,可实时检测)

面部表情识别4&#xff1a;C实现表情识别(含源码&#xff0c;可实时检测) 目录 面部表情识别4&#xff1a;C实现表情识别(含源码&#xff0c;可实时检测) 1.面部表情识别方法 2.人脸检测方法 3.面部表情识别模型(Python) &#xff08;1&#xff09; 面部表情识别模型的训练…

printf %.*s 原来是这样

今天看代码时&#xff0c;看到这样一个printf&#xff0c;以前没见过这样的&#xff0c;也没这样用过&#xff0c;一下子还真不知道是什么意思&#xff1a; // Response is received. Print it struct mg_http_message *hm (struct mg_http_message *) ev_data; printf("…

扫雷(超详解+全部码源)

C语言经典游戏扫雷 前言一.游戏规则二.所需文件三.创建菜单四.游戏核心内容实现1.创建棋盘2.打印棋盘3.布置雷4.排查雷5.game()函数具体实现 五.游戏运行实操六.全部码源 前言 &#x1f600;C语言实现扫雷是对基础代码能力的考察。通过本篇文章你将学会如何制作出扫雷&#xff…

Spring 使用注解储存对象

文章目录 前言存储 Bean 对象五大注解五大注解示例配置包扫描路径读取bean的示例 方法注解 Bean Bean 命名规则重命名 Bean 前言 通过在 spring-config 中添加bean的注册内容&#xff0c;我们已经可以实现基本的Spring读取和存储对象的操作了&#xff0c;但在操作中我们发现读…

每日一题——滑动窗口的最大值

滑动窗口的最大值 题目链接 暴力解法 最容易想到的当然还是通过两层循环来暴力求解&#xff1a;一层循环用来移动窗口&#xff0c;一层循环用来在窗口内找到最大值。这种做法的时间复杂度为O(kN)&#xff0c;会超出时间限制&#xff0c;因此&#xff0c;我们要找到更加高效的…

springboot国际化

springboot国际化 不需要引入额外的jar包 参考&#xff1a;https://zhuanlan.zhihu.com/p/551605839 1.rources要创建Resource Bundle 2.yml配置中引入Resource Bundle 引入Resource Bundle spring:messages:encoding: UTF-8basename: i18n/messages_common3.创建国际化工具…

彩色图转灰度图之c++实现(qt + 不调包)

1.介绍 在日常生活中&#xff0c;我们经常看到的图片是彩色图片&#xff0c;有时我们需要将彩色图片转换成灰度图片来处理&#xff0c;也就是将RGB三通道图片按照一定规则转换成一通道图片。 2.转换方式 彩色图片转灰度图片&#xff0c;一般有三种方法 第一种&#xff1a;平均法…

海思ss928部署手写数字识别模型

大致流程--------------------------------------------------------------------------------------------------------------------- 模型转换---------------------------------------------------------------------------------------------------- 1&#xff1a;准备MNI…

【EI复现】考虑区域多能源系统集群协同优化的联合需求侧响应模型(Matlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…

企业前后端分离软件架构如何设计?

企业前后端分离软件架构的设计涉及到前端和后端的独立性、通信方式、数据流管理等多个方面。下面我将为你介绍一个常见的前后端分离软件架构设计&#xff1a; 1、前端层&#xff1a; 框架选择&#xff1a;选择适合项目需求的前端框架&#xff0c;例如React、Vue.js、Angular等…

面试题记录

面试题记录 一.Vue中的合成事件和原生事件有哪些区别。二.parseint(3,2)返回什么值&#xff1f;为什么三.什么是闭包四.vue3和vue2区别有哪些五.vue3 响应式原理 双向绑定原理1. 响应式原理&#xff1a;2. 双向绑定原理&#xff1a;Vue3 中双向绑定的原理&#xff1a;下面是 Vu…

https的原理和方案

文章目录 https原理为什么要加密常见的加密方式对称加密非对称加密数据摘要&&数据指纹数据签名 https的几种工作方案方案一&#xff1a;只使用对称加密方案二&#xff1a;只使用非对称加密方案三&#xff1a;两端都使用非对称加密方案四&#xff1a;非对称加密 对称加…

苹果账号被禁用怎么办?

苹果账号被禁用怎么办&#xff1f; 转载&#xff1a;苹果账号被禁用怎么办&#xff1f; 当我们使用苹果手机登录App Store时&#xff0c;有时会遇到账号被禁用的提示。总结下来&#xff0c; 账号被禁用的原因可能有以下几种&#xff1a; 禁用的原因 1.在不同的设备上登录Ap…

CSS前端开发指南:创造精美的用户界面

简介&#xff1a; 《CSS前端开发指南&#xff1a;创造精美的用户界面》是一本旨在帮助读者掌握CSS技术&#xff0c;实现令人惊叹的前端用户界面的实用指南。无论您是初学者还是有经验的开发者&#xff0c;本书都将为您提供全面的知识和实用技巧&#xff0c;帮助您创建引人注目…

c语言每日一练(5)

前言&#xff1a;每日一练系列&#xff0c;每一期都包含5道选择题&#xff0c;2道编程题&#xff0c;博主会尽可能详细地进行讲解&#xff0c;令初学者也能听的清晰。每日一练系列会持续更新&#xff0c;暑假时三天之内必有一更&#xff0c;到了开学之后&#xff0c;将看学业情…

什么是设计模式?

目录 概述: 什么是模式&#xff01;&#xff01; 为什么学习模式&#xff01;&#xff01; 模式和框架的比较&#xff1a; 设计模式研究的历史 关于pattern的历史 Gang of Four(GoF) 关于”Design”Pattern” 重提&#xff1a;指导模式设计的三个概念 1.重用(reuse)…

函数式接口Consumer、BiConsumer、Supplier、Predicate、Function、BiFunction

函数式接口Consumer、BiConsumer、Supplier、Predicate、Function、BiFunction 1.Consumer Java Consumer接口来自Java 8中引入的 java.util.function包。 Consumer是一个功能接口&#xff0c;用来作为lambda表达式或方法引用的任务目标(传递一个参数执行指定的方法)。 Cons…

opencv基础48-绘制图像轮廓并切割示例-cv2.drawContours()

绘制图像轮廓&#xff1a;drawContours函数 在 OpenCV 中&#xff0c;可以使用函数 cv2.drawContours()绘制图像轮廓。该函数的语法格式是&#xff1a; imagecv2.drawContours( image, contours, contourIdx, color[, thickness[, lineType[, hierarchy[, maxLevel[, offset]]…