点击上方 好好学java ,选择 星标 公众号

重磅资讯、干货,第一时间送达
今日推荐:我的大学到研究生自学 Java 之路,过程艰辛,不放弃,保持热情,最终发现我是这样拿到大厂 offer 的!
作者:安详的苦丁茶
链接:https://www.cnblogs.com/ckfeng/p/12812214.html

项目描述:在微信小程序中通过与Springboot操作数据库实现简单的增删改查,其中我是用springboot整合mybatis-plus 和mysql使用的

1. 开发前准备

1.1 前置知识

  • java基础

  • SpringBoot简单基础知识

1.2 环境参数

  • 开发工具:IDEA

  • 基础环境:Maven+JDK8

  • 主要技术:SpringBoot、lombok、mybatis-plus、mysql 、微信小程序

  • SpringBoot版本:2.2.6

2.开发者服务器

项目结构:

2.1 初始配置

(1)pom.xml配置

 <dependencies><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.1.1</version></dependency><!--模板引擎--><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-thymeleaf</artifactId></dependency><!-- 引入阿里数据库连接池 --><dependency><groupId>com.alibaba</groupId><artifactId>druid</artifactId><version>1.1.14</version></dependency><!-- mysql依赖--><dependency><groupId>mysql</groupId><artifactId>mysql-connector-java</artifactId><version>5.1.42</version><scope>runtime</scope></dependency><!-- mybatisPlus 核心库 --><dependency><groupId>com.baomidou</groupId><artifactId>mybatis-plus-boot-starter</artifactId><version>3.1.0</version></dependency><!--生成实体成get set--><dependency><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId><optional>true</optional></dependency><!-- pagehelper 分页插件 --><dependency><groupId>com.github.pagehelper</groupId><artifactId>pagehelper-spring-boot-starter</artifactId><version>1.2.5</version></dependency><!--junit 测试--><dependency><groupId>junit</groupId><artifactId>junit</artifactId><scope>test</scope></dependency><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-test</artifactId><scope>test</scope><exclusions><exclusion><groupId>org.junit.vintage</groupId><artifactId>junit-vintage-engine</artifactId></exclusion></exclusions></dependency></dependencies><build><plugins><plugin><groupId>org.springframework.boot</groupId><artifactId>spring-boot-maven-plugin</artifactId></plugin></plugins></build></project>

(2)application.yml

# Spring Boot 的数据源配置
spring:datasource:name: wxurl: jdbc:mysql://localhost:3306/wx_mini_program?useUnicode=true&characterEncoding=utf8&zeroDateTimeBehavior=convertToNull&useSSL=true&serverTimezone=GMT%2B8username: rootpassword: root# 使用druid数据源type: com.alibaba.druid.pool.DruidDataSourcedriver-class-name: com.mysql.jdbc.Driverfilters: statmaxActive: 20 initialSize: 1 maxWait: 60000 minIdle: 1 timeBetweenEvictionRunsMillis: 60000 minEvictableIdleTimeMillis: 300000 validationQuery: select 'x' testWhileIdle: true testOnBorrow: false testOnReturn: false poolPreparedStatements: true maxPoolPreparedStatementPerConnectionSize: 20 maxOpenPreparedStatements: 20 # mybatis-plus相关配置
mybatis-plus:# xml扫描,多个目录用逗号或者分号分隔(告诉 Mapper 所对应的 XML 文件位置)mapper-locations: classpath:mapper/*.xml# 以下配置均有默认值,可以不设置global-config:db-config:#主键类型 AUTO:"数据库ID自增" INPUT:"用户输入ID",ID_WORKER:"全局唯一ID (数字类型唯一ID)", UUID:"全局唯一ID UUID";id-type: auto#字段策略 IGNORED:"忽略判断"  NOT_NULL:"非 NULL 判断")  NOT_EMPTY:"非空判断"field-strategy: NOT_EMPTY#数据库类型db-type: MYSQL# 指定实体类的包type-aliases-package: com.ckf.login_wx.entityconfiguration:# 是否开启自动驼峰命名规则映射:从数据库列名到Java属性驼峰命名的类似映射map-underscore-to-camel-case: true# 如果查询结果中包含空值的列,则 MyBatis 在映射的时候,不会映射这个字段call-setters-on-nulls: true# 这个配置会将执行的sql打印出来,在开发或测试的时候可以用log-impl: org.apache.ibatis.logging.stdout.StdOutImpl# PageHelper分页插件
pagehelper:helperDialect: mysqlreasonable: truesupportMethodsArguments: trueparams: count=countSql

2.2 小程序用户表


CREATE table users(id int not null PRIMARY key auto_increment,name varchar(255) not null,age int not null );insert into users value(null,'陈克锋',18);
insert into users value(null,'陈克帅',11);
insert into users value(null,'陈克兵',14); select * from users;

2.3 pojo

2.4 mapper

2.5 service

2.5 serviceImpl

配置SpringBoot扫描mapper

2.6 controller

LoginController


package com.ckf.login_wx.controller;import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RestController;import java.util.HashMap;
import java.util.Map; /*** @author 安详的苦丁茶* @date 2020/4/30 11:46 */ @RestController public class LoginController { /*** 登录* @param phone* @param password* @return */ @PostMapping("/doLogin") public Map doLogin(String phone, String password){Map map = new HashMap(); if ((phone.equals("10086")&& password.equals("123456"))){map.put("code",200);map.put("result","登录成功");System.out.println("登录成功");}else {map.put("result","no");} return map;}}

UserController


package com.ckf.login_wx.controller;import com.ckf.login_wx.entity.User;
import com.ckf.login_wx.servic.UserService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*; /*** @author 安详的苦丁茶* @date 2020/4/30 13:39 */ @RestController
@RequestMapping("/test") public class UserController {@Autowired private UserService userService; /*** 查询全部* @return */ @GetMapping("/list") public Object list(){System.out.println("查询成功"); return userService.list();} /*** 根据id删除* @param id* @return */ @GetMapping("/delete") public boolean delete(Integer id){System.out.println("删除成功"); return userService.removeById(id);} /***  根据id查询* @param id* @return */ @GetMapping("/byid") public Object byid(Integer id){System.out.println("查询成功"); return userService.getById(id);} /***  修改* @param user* @return */ @PostMapping("/update") public boolean update(@RequestBody User user){System.out.println("修改成功"); return userService.updateById(user);} /*** 添加* @param user* @return */ @PostMapping("/add") public boolean add(@RequestBody User user){System.out.println("添加成功"); return userService.save(user);}}

3. 微信小程序

项目结构:

3.1 初始配置

3.2 bing.wxml


<!--pages/bind/bind.wxml-->
<view><form bindsubmit='doLogin'><!--账号--><view class="inputView"><label class="loginLabel">账号</label><input name="phone" value='10086' class="inputText" placeholder="请输入账号" /></view><view class="line"></view><!--密码--><view class="inputView"><label class="loginLabel">密码</label><input name="password" value='123456' class="inputText" password="true" placeholder="请输入密码" /></view><view class="line"></view><!--按钮--><view class='backColor'><button class="loginBtn" formType="submit"  open-type='getUserInfo' >登录</button></view><!-- <view><button class="goRegistBtn" type="warn" open-type='getUserInfo' bindgetuserinfo='doLogin'>微信登录</button></view> --></form></view>

3.3 bing.js

3.3 list.wxml


<!--pages/list/list.wxml--><button class="add" type='primary' bindtap='addArea'>添加</button>
<view class="container"><view class='widget'><text class='column'>编号</text><text class='column'>姓名</text><text class='column'>年龄</text><text class='link-column'>操作</text></view><scroll-view scroll-y="true"><view><block wx:for='{{list}}'><view class='widget'> <text class='column'>{{item.id}}</text><text class='column'>{{item.name}}</text><text class='column'>{{item.age}}</text><view class='link-column'><navigator class='link' url='../operation/operation?id={{item.id}}'>编辑</navigator> |<text class='link' bindtap='deleteArea' data-areaid='{{item.id}}' data-areaname='{{item.name}}' data-index='{{index}}'>删除</text>  </view></view>      </block></view></scroll-view></view>

3.4 list.js


// pages/list/list.js
Page({ /*** 页面的初始数据 */ data: {list:[]}, /*** 生命周期函数--监听页面加载 */ onLoad: function (options) {}, /*** 生命周期函数--监听页面初次渲染完成 */ onReady: function () {}, /*** 生命周期函数--监听页面显示 */ onShow: function () { var that=this;wx.request({url: 'http://localhost:8080/test/list',method:'GET',data:{},success:function(res){ var list=res.data; if(list==null){ var toastText='获取数据失败';wx.showToast({title: toastText,icon:'',duration:2000 //弹出时间})}else{that.setData({list:list})}}})}, /*** 生命周期函数--监听页面隐藏 */ onHide: function () {}, /*** 生命周期函数--监听页面卸载 */ onUnload: function () {}, /*** 页面相关事件处理函数--监听用户下拉动作 */ onPullDownRefresh: function () {}, /*** 页面上拉触底事件的处理函数 */ onReachBottom: function () {}, /*** 用户点击右上角分享 */ onShareAppMessage: function () {},addArea:function(){wx.navigateTo({url:'../operation/operation' })},deleteArea: function (e) { var that=this;wx.showModal({title: '提示',content: '确定要删除[' + e.target.dataset.areaname +']吗?',success:function(sm){ if(sm.confirm){wx.request({url: 'http://localhost:8080/test/delete',data: { id: e.target.dataset.areaid},method:'GET',success:function(res){ var result=res.statusCode; var toastText="删除成功"; if(result!=200){toastText = "删除失败";}else{that.data.list.splice(e.target.dataset.index,1);that.setData({list:that.data.list});}wx.showToast({title: toastText,icon:'',duration:2000 });}})}}})}
})

3.5 app.json


{ "pages": [ "pages/bind/bind", "pages/list/list", "pages/logs/logs", "pages/operation/operation", "pages/index/index" ], "window": { "backgroundColor": "#F6F6F6", "backgroundTextStyle": "light", "navigationBarBackgroundColor": "#29d", "navigationBarTitleText": "login", "navigationBarTextStyle": "black" }, "sitemapLocation": "sitemap.json", "style": "v2" }

4. 测试

启动开发者服务器,启动SpringBoot的main方法。

打开微信小程序开发者工具

登录页面

首页

添加页面

修改页面

删除

到处基本的增删改查操作已经完成了

如有需要前往 Gitee(码云)下载

前台:https://gitee.com/ckfeng/applet_of_wechat.git

后台:https://gitee.com/ckfeng/wx_login.git

最后,再附上我历时三个月总结的 Java 面试 + Java 后端技术学习指南,这是本人这几年及春招的总结,目前,已经拿到了腾讯等大厂offer,拿去不谢,github 地址:https://github.com/OUYANGSIHAI/JavaInterview

这么辛苦总结,给个star好不好。 点击阅读原文,直达

Springboot 整合微信小程序实现登录与增删改查相关推荐

  1. Spring Boot 整合微信小程序实现登录与增删改查

    程序员的成长之路 互联网/程序员/技术/资料共享 关注 阅读本文大概需要 8 分钟. 作者:浮云骑士LIN cnblogs.com/ckfeng/p/12812214.html 项目描述:在微信小程序 ...

  2. 微信小程序——数组对象的增删改查

    微信小程序--数组对象的增.删.改.查 1.模拟数据的初始化定义 data: {type_name: '项目分类',name_name: '项目名称',type_sId: "",n ...

  3. 微信小程序之云数据库增删改查

    功能实现: tabbar导航栏 云数据库增删改查 一.效果图: 二.代码 app.json {"pages": ["pages/index/index",&qu ...

  4. 【微信小程序】数组的增删改查 添加与删除

    微信小程序,js页面中任意声明一个数组 在数组后面操作: 添加:push() 删除:pop() 在数组前面操作: 添加:unshift() 删除shift() 代码示例 /*** 页面的初始数据*/d ...

  5. 微信小程序之云函数增删改查(一)

    用云函数向数据库增加数据 最近,我在用小程序做毕业设计.在用云函数对数据库进行增删改查的时候,踩了很多坑.为避免更多的人踩坑,跟大家分享一下. 增加数据 众所周知,提交数据需要用到form表单,否则是 ...

  6. 小程序数据框有重影_微信小程序云开发数据库增删改查

    1.添加数据 onLoad: function (options) { this.adddemo(); }, adddemo:function() { const db = wx.cloud.data ...

  7. 微信小程序云开发—数据库增删改查

    首先新建小程序项目,后端服务选择"小程序云开发",新建项目成功后,开通云开发,在app.js中添加 wx.cloud.init({traceUser: true,}) 如下图所示, ...

  8. 微信小程序云开发实现增删改查操作

    初始化云函数 const db = wx.cloud.database();// 连接数据库 增加操作 // 添加数据addDate() {db.collection("Test" ...

  9. Springboot整合JDBC和DBUtils,实现简单的增删改查.

    Springboot整合JDBC和DBUtils,实现简单的增删改查. 一.pom.xml文件 <?xml version="1.0" encoding="UTF- ...

最新文章

  1. 【资源干货】超全!我常用的70个数据分析网址
  2. 打破国外垄断,我国拿下一项“制芯”关键技术
  3. Linux(debian)的网络内核参数优化来提高服务器并发处理能力
  4. deepin系统引导_国产 Linux 发行版 深度操作系统 20 正式版发布
  5. JSTL笔记—c标签
  6. primer premier 5 64位_王者荣耀:必出破军的3位英雄,玩他们不出破军?说明你是个菜鸟!...
  7. sql 181. 超过经理收入的员工
  8. centos8启动zk集群失败:zk Error contacting service. It is probably not running.
  9. php新特性:trait 关键字使用
  10. iOS里面MVC模式详解
  11. 信息学奥赛一本通 1942:【08NOIP普及组】ISBN号码 | OpenJudge NOI 1.7 29:ISBN号码 | 洛谷 P1055 [NOIP2008 普及组] ISBN 号码
  12. Git-Credential-Manager-for-Mac-and-Linux
  13. PHP-获取文件后缀名,并判断是否合法
  14. (三)Omniglot Dataset介绍
  15. 服务器定时关机 修改时间,服务器调定时关机
  16. centos7系统开启ftp服务器,centos7 开启ftp服务器
  17. oracle查询日期当天,oracle获取今天时间数据
  18. centos7 | All matches were filtered out by modular filtering for argument: mysql-community-server
  19. 【软考 系统架构设计师】计算机组成与体系结构⑥ 流水线
  20. Blood Cousins (dsu on tree + 求第k级祖先)

热门文章

  1. 基于用户评价的评分模型
  2. win32创建控件的一些问题
  3. 树莓派搭建TensorFlow
  4. 多索引表 (1)boost::multi_index多索引容器
  5. EOS 消息设计(3)并行处理之状态评估
  6. Hyperledger Fabric 链码(3) 生命周期和API
  7. 区块链BaaS云服务(12)易居(中国) 房地产 EBaaS(Estate Blockchain as a Service)
  8. 创新实训团队记录:为BR-MTC问题设计一个近似算法
  9. TEEC_AllocateSharedMemory()和 TEEC_RegisterSharedMemory()的总结
  10. 密码体制Feistel 密码的相关知识