<!--pages/login/login.wxml-->
<loading hidden="{{hidden}}">
 登錄中...
</loading>
<view class="container-login">
 <form catchsubmit="formSubmit">
  <view class='login-main'>
   <!-- username -->
   <view class="login-view">
    <image src='/images/icon/user.png'></image>
    <input type='text' name='username' placeholder='請輸入用戶名'></input>
   </view>
   <!-- password -->
   <view class="login-view">
    <image src='/images/icon/pwd.png'></image>
    <input type='password' name='password' placeholder='請輸入密碼'></input>
   </view>
  </view>
  <view class='login-part'>
   <button formType="submit" class="login-button" disabled="{{buthidden}}">登錄</button>
  </view>
 </form>
</view>

// pages/login/login.js
Page({
 
 /**
  * 頁面的初始數據
  */
 data: {
  hidden: true, //等待的展示與隱藏的控制
  buthidden: false //按鈕的可用和不可用的控制
 },
 
 /**
  * 生命周期函數--監聽頁面加載
  */
 onLoad: function (options) {
  
 },
 
 /**
  * 生命周期函數--監聽頁面初次渲染完成
  */
 onReady: function () {
 
 },
 
 /**
  * 生命周期函數--監聽頁面顯示
  */
 onShow: function () {
 
 },
 
 /**
  * 生命周期函數--監聽頁面隱藏
  */
 onHide: function () {
 
 },
 
 /**
  * 生命周期函數--監聽頁面卸載
  */
 onUnload: function () {
 
 },
 
 /**
  * 頁面相關事件處理函數--監聽用戶下拉動作
  */
 onPullDownRefresh: function () {
 
 },
 
 /**
  * 頁面上拉觸底事件的處理函數
  */
 onReachBottom: function () {
 
 },
 
 /**
  * 用戶點擊右上角分享
  */
 onShareAppMessage: function () {
 
 },
 
 /**
  * 表單提交：用戶登錄
  */
 formSubmit: function (e) {
  // 控制登錄按鈕，防止重復提交
  this.setData({
   hidden: false,
   buthidden: true
  })
 }
})