1# form 2 3> **说明:** 4> 从API version 6开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 5 6表单容器,支持容器内input元素的内容提交和重置。 7 8 9## 权限列表 10 11无 12 13 14## 子组件 15 16支持。 17 18 19## 属性 20 21支持[通用属性](../arkui-js/js-components-common-attributes.md)。 22 23 24## 样式 25 26支持[组件通用样式](../arkui-js/js-components-common-styles.md)。 27 28 29## 事件 30 31除支持[通用事件](../arkui-js/js-components-common-events.md)外,还支持如下事件: 32 33| 名称 | 参数 | 描述 | 34| -------- | -------- | -------- | 35| submit | FormResult | 点击提交按钮,进行表单提交时,触发该事件。 | 36| reset | - | 点击重置按钮后,触发该事件。 | 37 38**表1** FormResult 39 40| 名称 | 类型 | 描述 | 41| -------- | -------- | -------- | 42| value | Object | input元素的name和value的值。 | 43 44 45## 方法 46 47支持[通用方法](../arkui-js/js-components-common-methods.md)。 48 49 50## 示例 51 52```html 53<!-- xxx.hml --> 54<form onsubmit='onSubmit' onreset='onReset'> 55 <div style="width: 600px;height: 150px;flex-direction: row;justify-content: space-around;"> 56 <label>选项一</label> 57 <input type='radio' name='radioGroup' value='radio1'></input> 58 <label>选项二</label> 59 <input type='radio' name='radioGroup' value='radio2'></input> 60 </div> 61 <text style="margin-left: 50px;margin-bottom: 50px;">输入文本</text> 62 <input type='text' name='user'></input> 63 <div style="width: 600px;height: 150px;margin-top: 50px;flex-direction: row;justify-content: space-around;"> 64 <input type='submit'>Submit</input> 65 <input type='reset'>Reset</input> 66 </div> 67</form> 68``` 69 70```js 71// xxx.js 72export default{ 73 onSubmit(result) { 74 console.log(result.value.radioGroup) // radio1 or radio2 75 console.log(result.value.user) // text input value 76 }, 77 onReset() { 78 console.log('reset all value') 79 } 80} 81``` 82 83![zh-cn_image_0000001180658376](figures/zh-cn_image_0000001180658376.gif) 84