fix(input): 优化前缀样式 (#926)

components/input/__tests__/input-926.spec.ts

@@ -0,0 +1,49 @@
+import { mount } from '@vue/test-utils';
+import { readFileSync } from 'fs';
+import { resolve } from 'path';
+
+import getPrefixCls from '../../_util/getPrefixCls';
+import Input from '../input.vue';
+
+const prefixCls = getPrefixCls('input');
+const inputInnerPrefixCls = getPrefixCls('input-inner');
+
+function getInputInnerLess(): string {
+    return readFileSync(
+        resolve(__dirname, '../style/inputInner.less'),
+        'utf-8',
+    );
+}
+
+test('inputInner.less has vertical-align: middle for both prefix and suffix', () => {
+    const lessContent = getInputInnerLess();
+    const prefixMatch = lessContent.match(/&\-prefix\s*\{[^}]*vertical-align\s*:\s*middle/);
+    const suffixMatch = lessContent.match(/&\-suffix\s*\{[^}]*vertical-align\s*:\s*middle/);
+    expect(prefixMatch).not.toBeNull();
+    expect(suffixMatch).not.toBeNull();
+});
+
+test('FInput with prefix and suffix slots mounts without error', () => {
+    expect(() =>
+        mount(Input, {
+            props: {
+                modelValue: 'test',
+            },
+            slots: {
+                prefix: 'PREFIX',
+                suffix: 'SUFFIX',
+            },
+        }),
+    ).not.toThrow();
+    const wrapper = mount(Input, {
+        props: {
+            modelValue: '',
+        },
+        slots: {
+            prefix: 'PREFIX',
+            suffix: 'SUFFIX',
+        },
+    });
+    expect(wrapper.find(`.${inputInnerPrefixCls}-prefix`).exists()).toBe(true);
+    expect(wrapper.find(`.${inputInnerPrefixCls}-suffix`).exists()).toBe(true);
+});

components/input/style/inputInner.less

@@ -86,11 +86,12 @@
     }
     &-prefix {
         margin-right: 8px;
+        vertical-align: middle;
     }
 
     &-suffix {
         margin-left: 8px;
-        vertical-align: bottom;
+        vertical-align: middle;
     }
 
     &-icon {