第一周、3.Form组件

花开富贵

于 2022-05-08 18:34:37 发布

阅读量171

点赞数

文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/cxy2002cxy/article/details/124652184

版权

Form是一个表单容器，支持容器内Input组件内容的提交和重置。

创建Form组件实现表单缩放：

在pages/index目录下的hml文件中创建一个Form组件，为Form组件添加click-effect属性，实现点击表单后的缩放效果。

<!-- xxx.hml -->
<div class="container">
    <form  id="formId" class="formClass" click-effect="spring-large">
        <input type="text"></input>
    </form>
</div>

/* xxx.css */
.container {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #F1F3F5;
}
.formClass{
    width: 80%;
    padding: 10px;
    border: 1px solid #c3d3e7;
}