微信小程序——后台交互
目录
后台准备
pom.xml
配置数据源
整合mtbatis
前后端交互
method1
method2
后台准备
pom.xml
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd"><modelVersion>4.0.0</modelVersion><parent><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-parent</artifactId><version>2.6.2</version><relativePath/> <!-- lookup parent from repository --></parent><groupId>com.zking</groupId><artifactId>minoa</artifactId><version>0.0.1-SNAPSHOT</version><name>minoa</name><description>Demo project for Spring Boot</description><properties><java.version>1.8</java.version><fastjson.version>1.2.70</fastjson.version><jackson.version>2.9.8</jackson.version></properties><dependencies><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-jdbc</artifactId></dependency><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-web</artifactId></dependency><dependency><groupId>org.mybatis.spring.boot</groupId><artifactId>mybatis-spring-boot-starter</artifactId><version>2.2.1</version></dependency><dependency><groupId>mysql</groupId><artifactId>mysql-connector-java</artifactId><version>5.1.44</version><scope>runtime</scope></dependency><dependency><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId><optional>true</optional></dependency><dependency><groupId>com.alibaba</groupId><artifactId>fastjson</artifactId><version>${fastjson.version}</version></dependency></dependencies><build><plugins><plugin><groupId>org.springframework.boot</groupId><artifactId>spring-boot-maven-plugin</artifactId><configuration><excludes><exclude><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId></exclude></excludes></configuration></plugin><plugin><groupId>org.mybatis.generator</groupId><artifactId>mybatis-generator-maven-plugin</artifactId><version>1.3.2</version><dependencies><!--使用Mybatis-generator插件不能使用太高版本的mysql驱动 --><dependency><groupId>mysql</groupId><artifactId>mysql-connector-java</artifactId><version>${mysql.version}</version></dependency></dependencies><configuration><overwrite>true</overwrite></configuration></plugin></plugins></build></project>
配置数据源
spring:datasource:#type连接池类型 DBCP,C3P0,Hikari,Druid,默认为Hikaritype: com.zaxxer.hikari.HikariDataSourcedriver-class-name: com.mysql.jdbc.Driverurl: jdbc:mysql://localhost:3306/mybatis_oapro?useUnicode=true&characterEncoding=UTF-8&useSSL=falseusername: rootpassword: 123456
生成mapper接口、model实体类以及mapper映射文件
整合mtbatis
mybatis:mapper-locations: classpath*:mapper/*.xml #指定mapper文件位置type-aliases-package: com.zking.minoa.model #指定自动生成别名所在包
启动类
@MapperScan("com.zking.minoa.mapper") //指mapper接口所在包
然后启动后台即可
前后端交互
method1
首先在index.js中编写以下方法
loadMeetingInfo(){let that=this;wx.request({url: api.IndexUrl,dataType: 'json',success(res) {console.log(res)that.setData({lists:res.data.data.infoList})}})},
然后在该页面下方生命周期函数——监听页面加载代码块下编写以下方法
onLoad(options) {this.loadMeetingInfo();//首页会议信息},
由于后台是没有数据图片的,我们则需要在前端传入一张图片
index.wxml
<image class="video-img" mode="scaleToFill" src="{{item.image != null ? item.image : '/static/persons/1.jpg'}}"></image>
method2
封装request
utils/util.js
const formatTime = date => {const year = date.getFullYear()const month = date.getMonth() + 1const day = date.getDate()const hour = date.getHours()const minute = date.getMinutes()const second = date.getSeconds()return `${[year, month, day].map(formatNumber).join('/')} ${[hour, minute, second].map(formatNumber).join(':')}`
}const formatNumber = n => {n = n.toString()return n[1] ? n : `0${n}`
}/*** 封装微信的request请求*/
function request(url, data = {}, method = "GET") {return new Promise(function (resolve, reject) {wx.request({url: url,data: data,method: method,header: {'Content-Type': 'application/json',},success: function (res) {if (res.statusCode == 200) {resolve(res.data);//会把进行中改变成已成功} else {reject(res.errMsg);//会把进行中改变成已失败}},fail: function (err) {reject(err)}})});
}module.exports = {formatTime,request
}
在index.js的头部引用util
const util = require("../../utils/util.js")
编写方法
咱们先把method1的代码注释,再写method2,编写代码如下
loadMeetingInfo(){util.request(api.IndexUrl).then(res=>{this.setData({lists:res.data.infoList})});// let that=this;// wx.request({// url: api.IndexUrl,// dataType: 'json',// success(res) {// console.log(res)// that.setData({// lists:res.data.data.infoList// })// }// })},
效果展示

相关文章:
微信小程序——后台交互
目录 后台准备 pom.xml 配置数据源 整合mtbatis 前后端交互 method1 method2 后台准备 pom.xml <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"http://www.w3.org…...
3D模型如何添加表面贴图?
1、模型表面贴图介绍 模型表面贴图(Texture Mapping)是一种将纹理映射到三维模型表面的技术,用于增加模型的细节和真实感。它通过在模型的每个表面点上应用纹理坐标,并将纹理像素与模型的对应点进行匹配,使得模型表面…...
C语言之函数详解
目录 函数的定义 函数的调用 变量的存储类型 auto自动变量 extern外部变量 static静态变量 register寄存器变量 函数的定义 在C语言中,函数是一段可重复使用的代码块,用于执行特定的任务。函数的定义包括函数的声明和函数体两个部分。 函数的声…...
华纳云:mysql创建触发器报错的原因及解决方法是什么
在 MySQL 中创建触发器时可能会出现错误,这些错误通常是由于多种原因引起的,包括语法错误、权限问题、表结构问题等。以下是一些常见的创建触发器报错的原因和相应的解决方法: 1. 语法错误: 原因: 创建触发器的SQL语句…...
C++笔记之初始化二维矩阵的方法
C笔记之初始化二维矩阵的方法 —— 2023年5月20日 上海 code review! 文章目录 C笔记之初始化二维矩阵的方法一.常见方法1. 使用数组2. 使用向量3. 使用数组的动态分配4. 使用嵌套的 std::vector 并使用resize方法5. 初始化固定大小的 std::array 二.C中使用vector初始化二维矩…...
ArrayList与List的层级关系及ArrayList解析
List与ArrayList的关系 List List是一个接口,不能直接实例化。如果要使用必须去实例化List的实现类——ArrayList和LinkedList站在数据结构的角度看,List就是一个线性表。常见的线性表:顺序表、链表、栈、队列等 线性表 线性表是n个具有相…...
智慧公厕设备选型攻略,打造智能化便利生活体验
智慧公厕设备的选型对于打造智能化便利生活体验起着至关重要的作用。在不断提升城市品质的背景下,智慧公厕已成为城市建设中的一项重要内容。在选购智慧公厕设备时,我们需要考虑到不同版本的功能要求,确保公厕设备的质量和性能。本文以智慧公…...
TCP 协议的可靠传输机制是怎样实现的?
TCP 协议是一种面向连接的、可靠的、基于字节流的传输层协议。 1 它通过以下几种方法来保证数据传输的可靠性: 检验和:TCP 在发送和接收数据时,都会计算一个检验和,用来检测数据是否在传输过程中发生了错误或损坏。如果检验和不匹…...
Antv G6入门之旅--combo图
目录 什么是AntV G6 G6 的特性 G6 文档 安装 1 在项目中使用 NPM 包引入 2 在 HTML 中使用 CDN 引入 使用 Step 1 创建容器 Step 2 数据准备 Step 3 创建关系图 Step 4 配置数据源,渲染 React 中使用 G6 Combo图 什么是AntV G6 G6 是一个图可视化引擎…...
聊聊分布式架构09——分布式中的一致性协议
目录 01从集中式到分布式 系统特点 集中式特点 分布式特点 事务处理差异 02一致性协议与Paxos算法 2PC(Two-Phase Commit) 阶段一:提交事务请求 阶段二:执行事务提交 优缺点 3PC(Three-Phase Commit&#x…...
探索流视频的发送
1.网络连接 2.主设备将某处视频开始的视频数据发送给从设备。 之前有读取本地视频并播放的demo,所以可以先测试网络连接的问题。 先用模拟器进行模拟吧。方便进行测试。 是的,可以使用Android设备使用上述库或框架来构建实时Web应用程序。虽然这些库和框架在Java服…...
[ACTF2020 新生赛]Include 1
题目环境:超链接,点进去看看你能找到flag吗?除了这些网页什么都没有,但是不当紧,因为我们有一双善于发现的眼睛👀F12瞅瞅无,并无其他等等URL看了吗?发现存在一个参数file,…...
教师必备宝藏,强烈推荐
亲爱的教师朋友们,你们是不是在为学期末成绩查询而头疼呢?一学期下来,成堆的试卷和成绩单,还有学生家长的各种咨询,让人应接不暇。现在,我给你们分享一个教师必备的宝藏,让你们的成绩查询工作变…...
「北大社送书」学习MATLAB—从算法到实战
MATLAB科学计算从入门到精通 一句话推荐书籍特色内容简介书籍概览 从代码到函数,从算法到实战,从问题到应用,由浅入深掌握科学计算方法,高效解决实际问题。 一句话推荐 科学计算基础入门,高效解决实际问题。 书籍特色…...
clion安装C++远程linux开发并调试 从装centos虚拟机到完美开发调试
下载镜像 阿里云镜像 从vmware上安装虚拟机并提权开放ssh 更新编译环境 一般 gcc gdb 版本都是比较低的,适配不了clion的最低要求。 升级gdb参考博客 升级gcc参考博客 安装CMAKE 官方的源使用wget即可下载 未找到openssl的解决办法 注意版本,又踩个…...
Android笔记
目录 触摸事件java弱引用WorkerThread注解NonNull注解camera.setFrameProcessingFormat(ImageFormat.YUV_420_888);YUV_420_888的字节数据长啥样YUV_420_888的字节数组长啥样 触摸事件 java弱引用 创建对象的弱引用,在没有强引用指向改对象的情况下,垃圾…...
Java虚拟机内存区域、异常、垃圾收集器
java虚拟机 java内存区域 jvm的主要组成部分及作用 主要包含两个子系统和两个组件 子系统 类加载器(Class loader):根据给定的类路径来装载class文件到运行时数据区 …...
深入理解JVM虚拟机第十三篇:详解JVM中的程序计数器
文章目录 一:程序计数器 1:概念 2:官方说法 3:图解 4:特点...
《合成孔径雷达成像算法与实现》Figure5.5
clc clear close all%% 参数设置 Ta 64; % 脉冲持续时间 Ka -1.56e-2; % 方位向调频率 Delta_f_dop abs(Ta*Ka); …...
leetcode经典面试150题---2.移除元素
题目描述 给你一个数组 nums 和一个值 val,你需要 原地 移除所有数值等于 val 的元素,并返回移除后数组的新长度。 不要使用额外的数组空间,你必须仅使用 O(1) 额外空间并 原地 修改输入数组。 元素的顺序可以改变。你不需要考虑数组中超出新…...
shell脚本--常见案例
1、自动备份文件或目录 2、批量重命名文件 3、查找并删除指定名称的文件: 4、批量删除文件 5、查找并替换文件内容 6、批量创建文件 7、创建文件夹并移动文件 8、在文件夹中查找文件...
相机Camera日志实例分析之二:相机Camx【专业模式开启直方图拍照】单帧流程日志详解
【关注我,后续持续新增专题博文,谢谢!!!】 上一篇我们讲了: 这一篇我们开始讲: 目录 一、场景操作步骤 二、日志基础关键字分级如下 三、场景日志如下: 一、场景操作步骤 操作步…...
苍穹外卖--缓存菜品
1.问题说明 用户端小程序展示的菜品数据都是通过查询数据库获得,如果用户端访问量比较大,数据库访问压力随之增大 2.实现思路 通过Redis来缓存菜品数据,减少数据库查询操作。 缓存逻辑分析: ①每个分类下的菜品保持一份缓存数据…...
ETLCloud可能遇到的问题有哪些?常见坑位解析
数据集成平台ETLCloud,主要用于支持数据的抽取(Extract)、转换(Transform)和加载(Load)过程。提供了一个简洁直观的界面,以便用户可以在不同的数据源之间轻松地进行数据迁移和转换。…...
【RockeMQ】第2节|RocketMQ快速实战以及核⼼概念详解(二)
升级Dledger高可用集群 一、主从架构的不足与Dledger的定位 主从架构缺陷 数据备份依赖Slave节点,但无自动故障转移能力,Master宕机后需人工切换,期间消息可能无法读取。Slave仅存储数据,无法主动升级为Master响应请求ÿ…...
python报错No module named ‘tensorflow.keras‘
是由于不同版本的tensorflow下的keras所在的路径不同,结合所安装的tensorflow的目录结构修改from语句即可。 原语句: from tensorflow.keras.layers import Conv1D, MaxPooling1D, LSTM, Dense 修改后: from tensorflow.python.keras.lay…...
Python基于历史模拟方法实现投资组合风险管理的VaR与ES模型项目实战
说明:这是一个机器学习实战项目(附带数据代码文档),如需数据代码文档可以直接到文章最后关注获取。 1.项目背景 在金融市场日益复杂和波动加剧的背景下,风险管理成为金融机构和个人投资者关注的核心议题之一。VaR&…...
CRMEB 中 PHP 短信扩展开发:涵盖一号通、阿里云、腾讯云、创蓝
目前已有一号通短信、阿里云短信、腾讯云短信扩展 扩展入口文件 文件目录 crmeb\services\sms\Sms.php 默认驱动类型为:一号通 namespace crmeb\services\sms;use crmeb\basic\BaseManager; use crmeb\services\AccessTokenServeService; use crmeb\services\sms\…...
宇树科技,改名了!
提到国内具身智能和机器人领域的代表企业,那宇树科技(Unitree)必须名列其榜。 最近,宇树科技的一项新变动消息在业界引发了不少关注和讨论,即: 宇树向其合作伙伴发布了一封公司名称变更函称,因…...
代码规范和架构【立芯理论一】(2025.06.08)
1、代码规范的目标 代码简洁精炼、美观,可持续性好高效率高复用,可移植性好高内聚,低耦合没有冗余规范性,代码有规可循,可以看出自己当时的思考过程特殊排版,特殊语法,特殊指令,必须…...
