Element UI 组件库的使用

1 简介

Element，一套为开发者、设计师和产品经理准备的基于 Vue 3.0 的桌面端组件库

2 问题

2.1 DatePicker 组件生成 input 和 Input 、Select 组件生成的 input 在设置宽度 100%后，宽度不一致的问题

2.1.1 问题描述

DatePicker 组件生成 input 和 Input 、Select 组件生成的 input 在设置宽度 100%后，宽度不一致

2.1.2 产生原因

DatePicker 组件生成的 input 在前面会有一个小图标，默认的样式 padding-left: 30px ，而不带图标的 input 的默认样式为 padding-left: 15px ，因此当单纯的设置 width: 100% 会导致 input 宽度不同。

2.1.3 解决方式

el-date-picker 设置样式 style="width:100%;margin-right:-15px"