<view class="page">
<view>
<text>欢迎光临神州大酒店</text>
</view>
<form bindsubmit="formSubmit" bindreset="formReset" report-submit="true">
<view class="set1">
<view>
<text>房间数</text>
</view>
<view class="input">
<input placeholder="1" name="orderno"></input>
</view>
</view>
<view class="set2">
<view class="section_title">住宿</view>
<picker name="orderdate" mode="date" value="{{date}}" start="2022-01-01" end="2022-12-12">
<view class="picker">
日期{{date}}
</view>
</picker>
</view>
<view class="set3">
<view class="people">
<text>姓名</text>
</view>
<view class="name">
<input type="text" name="ordername" class="input" placeholder="先生" />
</view>
</view>
<view class="set4">
<view class="tel">
<text>电话</text>
</view>
<view class="inputtel">
<input type="text" class="ordertel" placeholder="13445453454" maxlength="11" style="width: 300rpx;" />
</view>
</view>
<view class="btn-area">
<button form-type="submit" type="primary">提交</button>
<button form-type="reset">重置</button>
</view>
</form>
</view>
.page{
margin: 0rpx 50rpx 50rpx 50rpx;
font-size: 50rpx;
background-color: lavender;
}
.set1{
margin: 0rpx 0rpx 50rpx 0rpx;
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
}
.input{
width: 60%;
}
.set2{
margin: 0rpx 0rpx 50rpx 0rpx;
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
}
.set3{
margin: 0rpx 0rpx 50rpx 0rpx;
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
}
.people{
flex: 2;
}
.name{
flex:3;
}
.set4{
margin: 0rpx 0rpx 50rpx 0rpx;
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
}
.tel{
flex: 1;
}
.inputtel{
flex: 4;
}
.btn-area{
width: 100%;
}
var app = getApp()
Page({
data:{
userInfo:null
},
//设置页面加载函数,获得全局变量userInfo
onLoad:function () {
// console.log("Hello Wechat test一下啦")
// console.log(app)
this.setData({
userInfo:app.globalData.userInfo
})
},
//设置表单提交函数
formSubmit : function(e){
var that = this
var orderno = e.detail.orderno
var orderdate = e.detail.value.orderdate
var ordername = e.detail.value.ordername
var ordertel = e.detail.ordertel
var formid = e.detail.formid
//表单校验
if(orderno == '' || orderdate == '' || ordername == '' || ordertel == ''){
wx.showModal({
title:'提示',
content:'不能为空'
})
}else{
wx.showToast({
title: '成功',
icon:'success',
duration:2000
}),
wx.request({
url: 'http://',//服务器信息
data:{
code:app.globalData.code,
FORMID:formid,
date:orderdate,
no:orderno,
name:ordername,
tel:ordertel
},
header:{
'content-type':'application/x-www-form-urlencoded'
},
success:function(res){
console.log(res)
}
})
}
},
//表单重置函数
formReset:function(){
this.setData({
data:''
})
},
//日期选择函数
bindDateChange(){
this.setData({
data:e.detail.value
})
}
})
数值转字符串:number.toString()/String(number)
字符串转数值:同上,反过来就行了
字符串转对象:JSON.parse() 注意小程序不支持eval()
App()是一个小程序的入口方法,写在app.js文件里。
开发时我们主要是把一些全局变量,全局方法放在App()里面,比如用户名,请求数据时的URL等
// app.js
App({
onLaunch() {
// 展示本地存储能力
const logs = wx.getStorageSync('logs') || []
logs.unshift(Date.now())
wx.setStorageSync('logs', logs)
// 登录
wx.login({
success: res => {
// 发送 res.code 到后台换取 openId, sessionKey, unionId
}
})
},
globalData: {
//全局变量
userInfo: null,
globalReqUrl: "http://localhost:8080" //请求数据时的URL
}
})
那么我们该如何调用这些全局变量呢?请看下一小标题(二、getApp())解释。
二、getApp()
getApp()方法用于获取App()的实例:
//在其他页面的js文件里
const app = getApp();
this.data.username = app.globalData.userInfo;
this.data.url= app.globalData.globalReqUrl;
var item = this.data.list[index];
var app = getApp();
app.item =item; //注意原来的App()当中并没有item这个数据。
//然后在其它页面的js文件里用上面的方法获取item即可。
showModal(模态框)
showToast消息提示接口
数值转字符串:number.toString()/String(number)
字符串转数值:同上,反过来就行了
字符串转对象:JSON.parse() 注意小程序不支持eval()
App()是一个小程序的入口方法,写在app.js文件里。
开发时我们主要是把一些全局变量,全局方法放在App()里面,比如用户名,请求数据时的URL等
// app.js
App({
onLaunch() {
// 展示本地存储能力
const logs = wx.getStorageSync('logs') || []
logs.unshift(Date.now())
wx.setStorageSync('logs', logs)
// 登录
wx.login({
success: res => {
// 发送 res.code 到后台换取 openId, sessionKey, unionId
}
})
},
globalData: {
//全局变量
userInfo: null,
globalReqUrl: "http://localhost:8080" //请求数据时的URL
}
})
那么我们该如何调用这些全局变量呢?请看下一小标题(二、getApp())解释。
二、getApp()
getApp()方法用于获取App()的实例:
//在其他页面的js文件里
const app = getApp();
this.data.username = app.globalData.userInfo;
this.data.url= app.globalData.globalReqUrl;
var item = this.data.list[index];
var app = getApp();
app.item =item; //注意原来的App()当中并没有item这个数据。
//然后在其它页面的js文件里用上面的方法获取item即可。
showModal(模态框)
showToast消息提示接口