javascript/element-plus
1
0
Fork 0
mirror of https://github.com/element-plus/element-plus.git synced 2025-08-26 04:27:26 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(components): [form] no margin when there is no label (#9940)

Browse Source
This commit is contained in:
Qiang
2022-09-27 22:54:00 +08:00
committed by GitHub
parent 7d1ecb6285
commit cc8b816bd9
4 changed files with 5 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/en-US/component/form.md
View File

@ -133,7 +133,7 @@ form/accessibility
| `label-position` | Position of label. If set to `'left'` or `'right'`, `label-width` prop is also required. | `'left' \| 'right' \| 'top'` | `'right'` |
| `label-width` | Width of label, e.g. `'50px'`. All its direct child form items will inherit this value. `auto` is supported. | `string \| number` | — |
| `label-suffix` | Suffix of the label. | `string` | — |
| `hide-required-asterisk` | Whether to hide required fields should have a red asterisk (star) beside their labels. | `boolean` | `false` |
| `hide-required-asterisk` | Whether to hide required fields should have a red asterisk (star) beside their labels. | `boolean` | `false` |
| `require-asterisk-position` | Position of asterisk. | `'left' \| 'right'` | `'left'` |
| `show-message` | Whether to show the error message. | `boolean` | `true` |
| `inline-message` | Whether to display the error message inline with the form item. | `boolean` | `false` |

1
packages/components/form/src/form-item.vue
View File

@ -377,6 +377,7 @@ const context: FormItemContext = reactive({
labelId,
inputIds,
isGroup,
hasLabel,
addInputId,
removeInputId,
resetField,

3
packages/components/form/src/form-label-wrap.tsx
View File

@ -88,8 +88,9 @@ export default defineComponent({
const { isAutoWidth } = props
if (isAutoWidth) {
const autoLabelWidth = formContext?.autoLabelWidth
const hasLabel = formItemContext?.hasLabel
const style: CSSProperties = {}
if (autoLabelWidth && autoLabelWidth !== 'auto') {
if (hasLabel && autoLabelWidth && autoLabelWidth !== 'auto') {
const marginWidth = Math.max(
0,
Number.parseInt(autoLabelWidth, 10) - computedWidth.value

1
packages/tokens/form.ts
View File

@ -52,6 +52,7 @@ export interface FormItemContext extends FormItemProps {
isGroup: boolean
labelId: string
inputIds: string[]
hasLabel: boolean
addInputId: (id: string) => void
removeInputId: (id: string) => void
validate: (