微信小程序 form组件详解及简单实例

微信小程序form

相关文章：

微信小程序 Button

微信小程序 radio

微信小程序 slider

微信小程序 switch

微信小程序 textarea

微信小程序 picker-view

微信小程序 picker

微信小程序 label

微信小程序 input 

微信小程序 form

微信小程序 checkbox

实现效果图：

将表单内的用户输入的switch input checkbox slider radio picker 提交

当点击

表单中 formType 为 submit 的 组件时，会将表单组件中的 value 值进行提交，需要在表单组件中加上 name 来作为 key。

属性名	类型	说明
report-submit	Boolean	是否返回formId用于发送模板消息
bindsubmit	EventHandle	携带form中的数据触发submit事件，event.detail = { value : {"name":"value"} , formId:"" }
bindreset	EventHandle	表单重置时会触发reset事件

示例代码：

 
 switch
 
 
 
 slider
 
 

 
 input
 
 
 
 radio
 
  radio1
  radio2
 
 
 
 checkbox
 
  checkbox1
  checkbox2
 
 
 
 

Submit Reset

Page({
 formSubmit: function(e) {
 console.log('form发生了submit事件，携带数据为：', e.detail.value)
 },
 formReset: function() {
 console.log('form发生了reset事件')
 }
})

感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！