博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
form
阅读量:6694 次
发布时间:2019-06-25

本文共 1667 字,大约阅读时间需要 5 分钟。

表单,将组件内的用户输入的<switch/> <input/> <checkbox/> <slider/> <radio/> <picker/> 提交。
属性名 类型 说明
report-submit Boolean 是否返回formId用于发送
bindsubmit EventHandle 携带form中的数据触发submit事件,event.detail = {value : {'name': 'value'} , formId: ''}
bindreset EventHandle 表单重置时会触发reset事件
<view class="page">
  <view class="page__hd">
    <text class="page__title">form</text>
    <text class="page__desc">表单</text>
  </view>
<form class="page__bd" catchsubmit="formSubmit" catchreset="formReset">
    <view class="section section_gap">
        <view class="section__title">switch</view>
        <switch name="switch" />
    </view>
    <view class="section section_gap">
        <view class="section__title">slider</view>
        <slider value="50" name="slider" show-value />
    </view>
    <view class="section">
        <view class="section__title">input</view>
        <input name="input" placeholder="please input here" />
    </view>
    <view class="section section_gap">
        <view class="section__title">readio</view>
        <radio-group name="radio-group">
            <label><radio value="radio1" />radio1</label>
            <label><radio value="radio2" />radio2</label>
        </radio-group>
    </view>
    <view class="section section_gap">
        <view class="section__title">checkbox</view>
        <checkbox-group name="radio-group">
            <label><checkbox value="radio1" />checkbox1</label>
            <label><checkbox value="radio2" />checkbox2</label>
        </checkbox-group>
    </view>
    <view class="btn-area">
        <button formType="submit">Submit</button>
        <button formType="reset">Reset</button>
    </view>
  </form>
</view>
 
Page({
    data:{
 
    },
    formSubmit : function (e) {
    console.log('form发生了submit事件,携带数据:',e.detail.value)
    },
    formReset : function (e) {
    console.log('form发生了reset事件,携带数据:',e.detail.value)
    }
})
 

转载于:https://www.cnblogs.com/tian-sun/p/7405649.html

你可能感兴趣的文章
201706061056-简陋版jquery全局消息订阅
查看>>
初识 Burp Suite
查看>>
Java面试题总结(不定期更新)
查看>>
软件工程项目组Z.XML会议记录 2013/10/22
查看>>
linux每日命令(18):whereis命令
查看>>
discuz的安装
查看>>
[题解]UVA10801 Lift Hopping
查看>>
杭电_ACM_Hat's Fibonacci
查看>>
《算术探索》(高斯) 第14目
查看>>
css与jquery、图标字体
查看>>
[2019.1.15]BZOJ2152 聪聪可可
查看>>
报表使用相关知识及技巧汇总
查看>>
Linux Ptrace 详解
查看>>
Python模块——hashlib
查看>>
Centos下基于Hadoop安装Spark(分布式)
查看>>
linux Tomcat配置
查看>>
IE兼容
查看>>
2017-2018-1 20155225 20155229 实验一 开发环境的熟悉
查看>>
《屌丝日记》系列-开篇
查看>>
23种设计模式 --(更新)
查看>>