本文给大家带来的是微信小程序宏华净水填写员工识别码完成服务设计制作开发教程，制作好以后效果图如下：
一、wxml页面代码如下：
<!--pages/over_work/over_work.wxml-->
<view class='bgGray'>
<view class='space10'></view>
<view class="defaultList">
<view class="list flex align inputItem">
<view class="icon item"><image mode="widthFix" src="../../image/wcfw_icon_sbm_default@3x.png"></image></view>
<view class="text item"> <input placeholder="请填写员工识别码"/></view>
</view>
</view>
<view class='space50'></view>
<view class='thisbtn'>完成服务</view>
<view class='space60'></view>
<text class='forget'>忘记识别码?</text>
</view>
|
二、wxss样式文件代码如下：
/* pages/over_work/over_work.wxss */
.defaultList{
margin: 0 0;
}
.forget{
text-align: center;
color: gray;
width: 120px;
margin: 0 auto;
display: block;
font-size: 13px;
}
|
三、js页面代码如下：
// pages/over_work/over_work.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
|
.jpg)
.jpg)
