vue element 表单左右布局以及遇到的问题
element 表单左右布局以及遇到的问题
·
1. 标题在左右,输入框在右边,一行展示
这里就要改变饿了么样式了,加上以下代码,就会左右布局,一行展示
/deep/ .el-form-item__content {
text-align: right;
}
2. 输入框会遇到宽度不一致情况
比如 el-select下拉框,可以给它加上固定宽度
3.在标题后面加上提示图标,因为标题在左边,所以样式要左浮动
<el-form-item label= '123'>
<span class="spans">
<el-tooltip placement="right">
<div slot="content"> 123 / 4576 / 789 / 123 </div>
<i class="el-icon-question"></i>
</el-tooltip>
</span>
<el-input/>
</el-form-item>
.spans {
float: left;
margin-left: -5px;
}
4. button按钮加载
<el-button class="sub-btn" :loading="subLoading" @click="onSubmit('form')">{{subTitle}}</el-button>
定义
subLoading 初始值 false
subTitle 初始值 下一步
当提交时,表单验证通过, this.subLoading = true, this.subTitle = '加载中,请稍后'
当接口返回200时,this.subLoading = false, this.subTitle = '加载完成'
更多推荐
已为社区贡献1条内容
所有评论(0)