1. 程式人生 > >微信小程式+SpringBoot+Mybatis登入demo(一、小程式端)

微信小程式+SpringBoot+Mybatis登入demo(一、小程式端)

現在微信小程式越來越火了,相信不少人都通過各種途徑學習過微信小程式或者嘗試開發,我也是因為新鮮感學習了一下,寫了一個登入demo

前言: 微信小程式開發者註冊API等亂起八糟的東西我這裡就不寫了,是SpringBoot框架不會搭建的可以看我上一篇文章,SpringBoot整合Mybatis這一章我會講一些。

技術棧: 前端:小程式原生API 後端:SpringBoot+Mybatis+MySQL+JDK1.8

小程式端 開啟微信開發者工具選擇小程式專案 這裡寫圖片描述

建立專案,這裡沒有AppID的可以選擇體驗小程式/小遊戲,有AppID的就不用選擇,

專案目錄,專案名稱自行填寫,我們這裡選擇建立普通快速啟動模板

這裡寫圖片描述

建立好後是這樣的一個結構

這裡寫圖片描述

下面我們看一下專案結構區

這裡寫圖片描述

我們在Pages上右鍵新建個檔案存放目錄

這裡寫圖片描述

建好資料夾後,我們在新建的資料夾上新建一個Page

這裡寫圖片描述

建立好之後是這樣的

這裡寫圖片描述

建立完後我們需要改一些配置讓右面的模擬器來顯示我們新建的當前頁面

這裡寫圖片描述 這時我們就可以去畫我們的登入頁面了,開啟.wxml檔案

這裡寫圖片描述

頁面畫好後,我們需要去監聽登入按鈕和獲取input的值,這些動作要去.js檔案裡寫

這裡寫圖片描述

最後一步請求java後臺,也是在.js檔案裡做,在點選登入按鈕的時候去請求後臺,所以我們還是在監聽按鈕的函式裡面去寫程式碼

這裡寫圖片描述

好了,小程式端的準備已經完成了,因為後臺還沒有搭建,所以現在是不能傳送請求的哦!

如有需要改正的地方還請大家多多指出!

後端的搭建我下一章會講解