form是一个表单容器,支持容器内 Input 组件内容的提交和重置。
创建form组件
在pages/index目录下的hml文件中创建一个form组件。
<!-- xxx.hml -->
<div class="container">
<form style="width: 100%; height: 20%">
<input type="text" style="width:80%"></input>
</form>
</div>
/* xxx.css */
.container {
width:100%;
height:100%;
flex-direction: column;
justify-content: center;
align-items: center;
background-color: #F1F3F5;
}
实现表单缩放
为form组件添加click-effect属性,实现点击表单后的缩放效果,click-effect枚举值请参考 通用属性 。
<!-- xxx.hml -->
<div class="container">
<form id="formId" class="formClass" click-effect="spring-large">
<input type="text"></input>
</form>
</div>