微信小程序+SpringBoot+mybatis+MySQL实现简单的登录

// pages/login_test/login.js
Page({

    /**
     * 页面的初始数据
     */
    data: {
        username:,
        password:
    },
  input_name:function(e){
        this.setData({
          username:e.detail.value
        })
    },
    input_pwd: function (e) {
        this.setData({
          password: e.detail.value
        })
    },
    submitButton:function(){
      console.log("点击按钮!" + "获取到的用户名:" + this.data.username + "获取到的密码:" + this.data.password)
        var that = this;

        wx.request({
          url: http://localhost:8080/login,
            method:POST,
            header:{content-type:application/x-www-form-urlencoded},
            data:{
              username: that.data.username,
              password: that.data.password
            },
            success:function(res){
                console.log("回调函数:"+res.data)
                var resData = res.data;
                if(resData == true){
                    wx.showToast({
                        title: 登录成功,
                        duration:2000
                    })
                }else{
                    wx.showToast({
                        title: 登录失败,
                        duration:2000
                    })
                }
            }

        })


    },


    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {

    },

    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {

    },

    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {

    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {

    },

    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {

    },

    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {

    },

    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {

    },

    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {

    }
})

接下来我们编写后台 首先我们建一个数据库表 账号和密码分别为admin,admin 8.创建一个springboot项目。 利用mybatis逆向工程生成对应的文件。 不会mybatis逆向工程的看我之前的文章

9.Controller类

10.Service类

package com.springboot.service;

public interface UserService {
    boolean login(String username,String password);
}

11.实现Service类

package com.springboot.service;

import com.springboot.dao.UserEntityMapper;
import com.springboot.dao.entity.UserEntity;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

@Service
public class UserServiceImpl implements UserService{
    @Autowired
    private UserEntityMapper userEntityMapper;
    @Override
    public boolean login(String username,String password){
        UserEntity userEntity = new UserEntity ();
        userEntity.setUsername ( username );
        userEntity.setPassword ( password );

        UserEntity user = userEntityMapper.selectUser ( userEntity );
        if (user != null){
            return true;
        }
        return false;
    }

}

12.Mapper类

UserEntity selectUser(UserEntity userEntity);

13.Mapper.xml

<select id="selectUser" parameterType="com.springboot.dao.entity.UserEntity" resultMap="BaseResultMap">
    select * from user where username=#{username} and password=#{password}
  </select>

运行结果:

我们输入正确的账号密码,账号admin,密码admin 运行如下

大功告成!!!

经验分享 程序员 微信小程序 职场和发展