微信小程序（第二十二章）- 表单数据提交

问题

1. 1. 什么时候（怎样）提交数据？
2. 2. 当点击 form 表单中 form-type 为 submit 的 button 组件时，会将表单组件中的 value 值进行提交，需要在表单组件中加上 name 来作为 key。

实现步骤

1. 给form组件添加bindsubmit事件，在js里面定义对应的时间函数;
2. 给button按钮添加form-type属性，值：submit，提交表单
3. 在事件函数里获取要提交的数据；
   1. 需要给input组件添加name属性；
   2. 通过事件函数的事件对象获取值；
4. 后续可以通过API发送请求；

代码如下：

<!--定义form组件-->
<form bindsubmit="toLogin">
    <!--输入框区块-->
    <view id="inputView">
        <!--文本框-->
        <input type="text" placeholder="手机号/用户名" name="userName"></input>
        <!--密码框-->
        <input type="text" placeholder="密码" password name="userPwd"></input>
    </view>
    <!--按钮区域-->
    <view id="buttonView">
        <button form-type="submit">登录</button>
        <button>注册</button>
        <view>忘记密码</view>
    </view>
</form>

//登录函数
    toLogin(e){
        //获取提交的用户名和密码用变量存储
        var userName=e.detail.value.userName;
        var userPwd=e.detail.value.userPwd;
        console.log("要提交给服务器的用户名和密码是",userName,userPwd);
    },