微信小程序之表单组件的示例分析-创新互联
小编给大家分享一下微信小程序之表单组件的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!
创新互联公司是一家专业提供安庆企业网站建设,专注与成都做网站、成都网站建设、HTML5、小程序制作等业务。10年已为安庆众多企业、政府机构等服务。创新互联专业网站制作公司优惠进行中。1.表单,将组件内的用户输入的
2.picker
从底部弹起的滚动选择器,现支持三种选择器,通过mode来区分,分别是普通选择器,时间选择器,日期选择器,默认是普通选择器。
3.label:用来改进表单组件的可用性,使用for
属性找到对应的id
,或者将控件放在该标签下,当点击时,就会触发对应的控件。for
优先级高于内部控件,内部有多个控件的时候默认触发第一个控件。目前可以绑定的控件有:,
,
,
。
二.列子
index.wxml
2.index.wxss
.section{ margin:10px 20px; display:flex; border-bottom:1px solid #ccc; padding:15px 0; } .section__title{ width:30%; } .section__iput{ width:70%; line-height:25px; border:1px solid #ccc; } .btn-area{ display:flex; justify-content:center; margin:20px; } .btn-area button{ width:40%; }
3.index.js
var app = getApp() Page({ data: { date: '2016-09-01', }, //日期 bindDateChange: function(e) { this.setData({ date: e.detail.value }) }, //提交 formSubmit: function(e) { console.log('form发生了submit事件,携带数据为:', e.detail.value) }, //重置 formReset: function() { console.log('form发生了reset事件') } })
以上是“微信小程序之表单组件的示例分析”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注创新互联行业资讯频道!
分享标题:微信小程序之表单组件的示例分析-创新互联
URL标题:http://myzitong.com/article/ccjdjg.html