注：iVX也有免費直播課《第八期直播課》

首先打開在線編輯器進入我們的項目：https://editor.ivx.cn/

一、登錄頁功能實現

上一節中已經完成了登錄頁的頁面制作，那么這一節就開始對應的完成登錄頁的功能實現。

登錄頁的功能實現主要是對用戶登錄后進行昵稱獲取等操作（在本項目中）。那么必然需要一個數據庫進行用戶的存儲；在ivx 中用戶存儲需要一個組件“用戶”，用戶組件點擊后臺后選擇私有用戶組件即可進行增加：

增加完畢后可以對其進行重命名使整個項目更加清晰：

我們給登錄設置事件：

此時選擇剛剛添加的用戶組件進行對應的登錄動作，需要將手機號、驗證碼作為參數，接著給予一個回調，判斷用戶是否登錄成功：

在回調中直接判斷當前的登錄結果，是否成功如果是是，那么就是登錄成功，將會進行彈出提示登錄成功，其余情況就是登錄失敗，直接給予對應彈窗文本為登錄失敗的原因即可。

二、驗證碼獲取

那么此時我們的驗證碼獲取還未制作，那么此時給予對應的發送按鈕事件：

此時直接在發起觸發觸發器時進行驗證碼獲取，需要傳入手機號作為對應的參數，還需要注意，類型需要選擇為登錄驗證，否則將會出現 bug，在此處還需要選擇無須圖片驗證碼，否則將會獲取不到手機短信。

在這里編寫了短信獲取動作之后，也解釋了為什么需要判斷登錄倒計時為 60 才發起服務，這樣才可以限制發起短信驗證碼動作次數，否則只要點擊當前的按鈕就會發起獲取驗證碼服務，并且過多發起將會限制 ip。

三、注冊頁制作

注冊頁與當前的登錄頁制作類似，直接復制整個登錄塊：

接著重命名為注冊塊，并且對應的把提示的文本更改問注冊：

此時還需要更改對應的事件和新建兩個組件，一個是新建一個倒計時變量命名為注冊倒計時，用于存儲注冊的驗證碼倒計時描述存儲，另一個是創建一個觸發器命名為注冊驗證碼倒計時觸發器：

接著更改對應的事件對象，不然的話你將會調用到登錄框部分的組件內容：

接著把提示以及對應所需要的參數內容重新進行選擇，防止調用錯誤的內容值：

此時我們發現少了昵稱內容，只需要重新創建一個一個行，命名為昵稱輸入框即可：

接著再把這個昵稱內容給予到對應的參數之中：

接著我們再修改觸發器的選擇組件即可，在此一定要注意，選擇正確的組件，否則會出現你意想不到的錯誤，并且也不好排查：

此時我們測試數據：

成功后我們點擊用戶數據可以查看注冊的用戶：

我們再嘗試登陸內容：

此時你可以選擇注冊成功后顯示登錄框：

直接隱藏登錄框即可：

四、優化

接下來我們還可以優化一下登錄和注冊的操作，例如直接點擊發送驗證碼時，點擊條件 + 號，直接判斷手機號是否等于 11 位，否則就不是正確的手機號：

還可以給予一個其余條件，給予提示輸入的不是正確的手機號：

注冊時也可以給予對應的信息判斷，判斷驗證碼、手機號、昵稱是否輸入正確，否則就彈出提示：

登錄頁也可以做判斷，內容重復不再贅述。

總結

以上是生活随笔為你收集整理的四、登录注册页功能实现《iVX低代码/无代码个人博客制作》的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。