The applet provides a simple example of the form function for retrieving input data.
This example describes how to use a applet to obtain input data from a form. We will share this with you for your reference. The details are as follows:
1. Effect display
2. Key code
Index. wxml
<Form bindsubmit = "formBindsubmit" bindreset = "formReset"> <view style = "display: flex;"> <label> User Name: </label> <input name = "userName" placeholder = "Enter the user name! "/> </View> <view style =" display: flex; "> <label> password: </label> <input name = "psw" placeholder = "enter the password! "Password =" true "/> </view> <view style =" display: flex; margin-top: 30px; "> <button style =" width: 30%; "formType =" submit "> logon </button> <button style =" width: 30% "formType =" reset "> reset </button> </view> </form> <view >{{ tip }}</view> <view >{{ userName} }</view> <view >{{ psw }}</view>
Index. js
Page ({data: {// text: "This is a Page" tip: '', userName:'', psw: ''}, formBindsubmit: function (e) {if (e. detail. value. userName. length = 0 | e. detail. value. psw. length = 0) {this. setData ({tip: 'prompt: the user name and password cannot be blank! ', UserName: '', psw:''})} else {this. setData ({tip: '', userName: 'user name: '+ e. detail. value. userName, psw: 'password: '+ e. detail. value. psw}) }}, formReset: function () {this. setData ({tip: '', userName:'', psw :''})}})
3. Click here for the complete instance codeDownload from this site.
I hope this article will help you develop small programs.