开发微信小程序，代码构成是由JSON配置、WXML模板、WXSS样式、JS逻辑交互组成。
一个服务仅仅只有界面展示是不够的，还需要和用户做交互：响应用户的点击、获取用户的位置等等。在小程序里边，我们就通过编写 JS 脚本文件来处理用户的操作。以下是我的登录页面的js代码：
// pages/login/login.jsPage({/*** 页面的初始数据*/data: {},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function () {},/*** 生命周期函数--监听页面显示*/onShow: function () {},/*** 生命周期函数--监听页面隐藏*/onHide: function () {},/*** 生命周期函数--监听页面卸载*/onUnload: function () {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {},/*** 用户点击右上角分享*/onShareAppMessage: function () {},formSubmit: function (e) {// console.log('form发生了submit事件，携带数据为：', e.detail.value),wx.request({url: 'https://www.lishuming.top/pj/index.php/student/api/login',data:{username: e.detail.value.no,password: e.detail.value.pwd},header: {"content-type":'application/json'//默认值},success:function(res){console.log(res.data)wx.setStorage({key: "student",data: 'res.data',});wx.redirectTo({url: "../teachers/teachers"})}})},formReset: function () {console.log('form发生了reset事件')}})
wxml内容：<!--pages/login/login.wxml--><!-- <view class="container log-list"><view class="title">评分系统学生登录</view><form bindsubmit="formSubmit" bindreset="formReset"> <view class="section"><view class="section__title">学号：</view><input name="input" name="no" value='1635050251' placeholder="请输入学号" /></view><view class="section"><view class="section__title">密码：</view><input name="input" password='true' name="pwd" value='123456' placeholder="请输入密码" /></view><view class="btn-area"><button formType="submit">登录</button><button formType="reset">重置</button></view></form></view> -->wxss内容：/* pages/login/login.wxss *//* form{width: 100%;margin-top: 50rpx; }.title{font-size: 48rpx;margin-bottom: 30rpx; font-weight: bold; }.section__title {font-size: 40rpx;padding: 20rpx;color: #000;} input {padding: 24rpx;background:rgb(246,248,248);height: 24rpx;}.btn-area{margin-top: 100rpx; }button {margin: 20rpx;background: #9FB6CD;} */
