diff --git a/packages/devui-vue/devui/input/__tests__/input.spec.ts b/packages/devui-vue/devui/input/__tests__/input.spec.ts
index 3256372c999522de38624df244eec58974bcf5a5..3377eac590168c32aa4ca953230d90d553c1c191 100644
--- a/packages/devui-vue/devui/input/__tests__/input.spec.ts
+++ b/packages/devui-vue/devui/input/__tests__/input.spec.ts
@@ -1,38 +1,38 @@
-import { mount } from '@vue/test-utils';
-import { ref, nextTick } from 'vue';
-import DInput from '../src/input';
+import { mount } from '@vue/test-utils'
+import { ref, nextTick } from 'vue'
+import DInput from '../src/input'
 
 describe('d-input', () => {
   it('d-input render work', async () => {
-    const value = ref('abc');
+    const value = ref('abc')
     const wrapper = mount({
       components: { DInput },
       template: `
-        <d-input v-model:value="value" />
+        <d-input v-model="value" />
       `,
-      setup () {
+      setup() {
         return {
           value
-        };
+        }
       }
-    });
-    const input = wrapper.find('input');
-    expect(input.attributes('dinput')).toBe('true');
-    expect(input.element.value).toBe('abc');
+    })
+    const input = wrapper.find('input')
+    expect(input.attributes('dinput')).toBe('true')
+    expect(input.element.value).toBe('abc')
 
-    await input.setValue('def');
-    expect(value.value).toBe('def');
+    await input.setValue('def')
+    expect(value.value).toBe('def')
 
-    value.value = 'thx';
-    await nextTick();
-    expect(input.element.value).toBe('thx');
-  });
+    value.value = 'thx'
+    await nextTick()
+    expect(input.element.value).toBe('thx')
+  })
 
   it('d-input bindEvents work', async () => {
     const onChange = jest.fn(),
       onFocus = jest.fn(),
       onBlur = jest.fn(),
-      onKeydown = jest.fn();
+      onKeydown = jest.fn()
     const wrapper = mount({
       components: { DInput },
       template: `
@@ -42,88 +42,88 @@ describe('d-input', () => {
           @blur="onBlur"
           @keydown="onKeydown" />
       `,
-      setup () {
+      setup() {
         return {
           onChange,
           onFocus,
           onBlur,
           onKeydown
-        };
+        }
       }
-    });
-    const input = wrapper.find('input');
+    })
+    const input = wrapper.find('input')
 
-    await input.trigger('change');
-    expect(onChange).toBeCalledTimes(1);
+    await input.trigger('change')
+    expect(onChange).toBeCalledTimes(1)
 
-    await input.trigger('focus');
-    expect(onFocus).toBeCalledTimes(1);
+    await input.trigger('focus')
+    expect(onFocus).toBeCalledTimes(1)
 
-    await input.trigger('blur');
-    expect(onBlur).toBeCalledTimes(1);
+    await input.trigger('blur')
+    expect(onBlur).toBeCalledTimes(1)
 
-    await input.trigger('keydown');
-    expect(onKeydown).toBeCalledTimes(1);
-  });
+    await input.trigger('keydown')
+    expect(onKeydown).toBeCalledTimes(1)
+  })
 
   it('d-input disabled work', async () => {
     const wrapper = mount(DInput, {
       props: {
         disabled: false
       }
-    });
-    const input = wrapper.find('input');
-    expect(input.attributes('disabled')).toBe(undefined);
+    })
+    const input = wrapper.find('input')
+    expect(input.attributes('disabled')).toBe(undefined)
 
     await wrapper.setProps({
       disabled: true
-    });
-    expect(input.attributes('disabled')).toBe('');
-  });
+    })
+    expect(input.attributes('disabled')).toBe('')
+  })
 
   it('d-input error work', async () => {
     const wrapper = mount(DInput, {
       props: {
         error: false
       }
-    });
-    const input = wrapper.find('input');
-    expect(input.classes()).not.toContain('error');
+    })
+    const input = wrapper.find('input')
+    expect(input.classes()).not.toContain('error')
 
     await wrapper.setProps({
       error: true
-    });
-    expect(input.classes()).toContain('error');
-  });
+    })
+    expect(input.classes()).toContain('error')
+  })
 
   it('d-input size work', async () => {
-    const wrapper = mount(DInput);
-    const input = wrapper.find('input');
-    expect(input.classes()).not.toContain('devui-input-sm');
-    expect(input.classes()).not.toContain('devui-input-lg');
+    const wrapper = mount(DInput)
+    const input = wrapper.find('input')
+    expect(input.classes()).not.toContain('devui-input-sm')
+    expect(input.classes()).not.toContain('devui-input-lg')
 
     await wrapper.setProps({
       size: 'sm'
-    });
-    expect(input.classes()).toContain('devui-input-sm');
-    expect(input.classes()).not.toContain('devui-input-lg');
+    })
+    expect(input.classes()).toContain('devui-input-sm')
+    expect(input.classes()).not.toContain('devui-input-lg')
 
     await wrapper.setProps({
       size: 'lg'
-    });
-    expect(input.classes()).not.toContain('devui-input-sm');
-    expect(input.classes()).toContain('devui-input-lg');
-  });
+    })
+    expect(input.classes()).not.toContain('devui-input-sm')
+    expect(input.classes()).toContain('devui-input-lg')
+  })
 
   it('d-input showPassword work', async () => {
-    const wrapper = mount(DInput);
-    const input = wrapper.find('input');
+    const wrapper = mount(DInput)
+    const input = wrapper.find('input')
 
-    expect(input.attributes('type')).toBe('text');
+    expect(input.attributes('type')).toBe('text')
 
     await wrapper.setProps({
       showPassword: true
-    });
-    expect(input.attributes('type')).toBe('password');
-  });
-});
+    })
+    expect(input.attributes('type')).toBe('password')
+  })
+})
diff --git a/packages/devui-vue/devui/input/src/input.tsx b/packages/devui-vue/devui/input/src/input.tsx
index 22822ede377485f02af997e2424d0e5e178ca86e..50bcfa237aec88db3b6a7cf5eaf4034a24c0408b 100644
--- a/packages/devui-vue/devui/input/src/input.tsx
+++ b/packages/devui-vue/devui/input/src/input.tsx
@@ -1,7 +1,7 @@
-import { defineComponent, computed, ref, watch, nextTick, onMounted, toRefs, inject } from 'vue';
-import { inputProps, InputType } from './use-input';
+import { defineComponent, computed, ref, watch, inject } from 'vue'
+import { inputProps, InputType } from './use-input'
 import './input.scss'
-import { dFormItemEvents, IFormItem, formItemInjectionKey } from '../../form/src/form-types';
+import { dFormItemEvents, IFormItem, formItemInjectionKey } from '../../form/src/form-types'
 
 export default defineComponent({
   name: 'DInput',
@@ -15,11 +15,11 @@ export default defineComponent({
     }
   },
   props: inputProps,
-  emits: ['update:value', 'focus', 'blur', 'change', 'keydown'],
+  emits: ['update:modelValue', 'focus', 'blur', 'change', 'keydown'],
   setup(props, ctx) {
-    const formItem = inject(formItemInjectionKey, {} as IFormItem);
-    const hasFormItem = Object.keys(formItem).length > 0;
-    const sizeCls = computed(() => `devui-input-${props.size}`);
+    const formItem = inject(formItemInjectionKey, {} as IFormItem)
+    const hasFormItem = Object.keys(formItem).length > 0
+    const sizeCls = computed(() => `devui-input-${props.size}`)
     const showPwdIcon = ref(false)
     const inputType = ref<InputType>('text')
     const inputCls = computed(() => {
@@ -30,31 +30,40 @@ export default defineComponent({
       }
     })
     const showPreviewIcon = computed(() => inputType.value === 'password')
-    watch(() => props.showPassword, flg => {
-      inputType.value = flg ? 'password' : 'text'
-    }, { immediate: true })
+    watch(
+      () => props.showPassword,
+      (flg) => {
+        inputType.value = flg ? 'password' : 'text'
+      },
+      { immediate: true }
+    )
 
-    watch(() => props.value, value => {
-      (value && value.length > 0 && showPreviewIcon.value) ? showPwdIcon.value = true : showPwdIcon.value = false
-    })
+    watch(
+      () => props.modelValue,
+      (value) => {
+        value && value.length > 0 && showPreviewIcon.value
+          ? (showPwdIcon.value = true)
+          : (showPwdIcon.value = false)
+      }
+    )
 
     const onInput = ($event: Event) => {
-      ctx.emit('update:value', ($event.target as HTMLInputElement).value);
-      hasFormItem && formItem.formItemMitt.emit(dFormItemEvents.input);
-    },
+        ctx.emit('update:modelValue', ($event.target as HTMLInputElement).value)
+        hasFormItem && formItem.formItemMitt.emit(dFormItemEvents.input)
+      },
       onFocus = () => {
-        ctx.emit('focus');
+        ctx.emit('focus')
       },
       onBlur = () => {
-        ctx.emit('blur');
-        hasFormItem && formItem.formItemMitt.emit(dFormItemEvents.blur);
+        ctx.emit('blur')
+        hasFormItem && formItem.formItemMitt.emit(dFormItemEvents.blur)
       },
       onChange = ($event: Event) => {
-        ctx.emit('change', ($event.target as HTMLInputElement).value);
-        hasFormItem && formItem.formItemMitt.emit(dFormItemEvents.change);
+        ctx.emit('change', ($event.target as HTMLInputElement).value)
+        hasFormItem && formItem.formItemMitt.emit(dFormItemEvents.change)
       },
       onKeydown = ($event: KeyboardEvent) => {
-        ctx.emit('keydown', $event);
+        ctx.emit('keydown', $event)
       },
       onChangeInputType = () => {
         inputType.value = inputType.value === 'password' ? 'text' : 'password'
@@ -70,11 +79,11 @@ export default defineComponent({
       onChange,
       onKeydown,
       onChangeInputType
-    };
+    }
   },
-  render () {
+  render() {
     const {
-      value,
+      modelValue,
       showPreviewIcon,
       showPwdIcon,
       inputCls,
@@ -88,14 +97,14 @@ export default defineComponent({
       onBlur,
       onChange,
       onKeydown,
-      onChangeInputType,
-    } = this;
+      onChangeInputType
+    } = this
     return (
-      <div class="devui-input__wrap">
+      <div class='devui-input__wrap'>
         <input
           v-focus={autoFocus}
-          {...{dinput: true}}
-          value={value}
+          {...{ dinput: true }}
+          value={modelValue}
           disabled={disabled}
           type={inputType}
           maxlength={maxLength}
@@ -105,16 +114,18 @@ export default defineComponent({
           onFocus={onFocus}
           onBlur={onBlur}
           onChange={onChange}
-          onKeydown={onKeydown} 
+          onKeydown={onKeydown}
         />
-        {
-          showPwdIcon && <div class="devui-input__preview" onClick={onChangeInputType}>
-          { showPreviewIcon
-            ? <d-icon name="preview" size="12px" key={1}/>
-            : <d-icon name="preview-forbidden" size="12px" key={2} />
-          }
-        </div>}
+        {showPwdIcon && (
+          <div class='devui-input__preview' onClick={onChangeInputType}>
+            {showPreviewIcon ? (
+              <d-icon name='preview' size='12px' key={1} />
+            ) : (
+              <d-icon name='preview-forbidden' size='12px' key={2} />
+            )}
+          </div>
+        )}
       </div>
-    );
+    )
   }
-});
+})
diff --git a/packages/devui-vue/devui/input/src/use-input.tsx b/packages/devui-vue/devui/input/src/use-input.tsx
index 5706ad2774fdfe141ad03ea954b0897d7d274e41..8a46ec40a21664206267f7e4d888667c92dfc395 100644
--- a/packages/devui-vue/devui/input/src/use-input.tsx
+++ b/packages/devui-vue/devui/input/src/use-input.tsx
@@ -1,4 +1,4 @@
-import { PropType } from 'vue';
+import { PropType } from 'vue'
 
 export const inputProps = {
   placeholder: {
@@ -33,31 +33,31 @@ export const inputProps = {
     type: Boolean,
     default: false
   },
-  value: {
+  modelValue: {
     type: String,
     default: ''
   },
-  'onUpdate:value': {
+  'update:modelValue': {
     type: Function as PropType<(v: string) => void>,
     default: undefined
   },
-  'onChange': {
+  onChange: {
     type: Function as PropType<(v: string) => void>,
     default: undefined
   },
-  'onKeydown': {
+  onKeydown: {
     type: Function as PropType<(v: KeyboardEvent) => void>,
     default: undefined
   },
-  'onFocus': {
+  onFocus: {
     type: Function as PropType<() => void>,
     default: undefined
   },
-  'onBlur': {
+  onBlur: {
     type: Function as PropType<() => void>,
     default: undefined
   }
-} as const;
+} as const
 
 export type PreviewIconType = 'preview' | 'icon-preview-forbidden'
 export type InputType = 'password' | 'text'
diff --git a/packages/devui-vue/docs/components/input/index.md b/packages/devui-vue/docs/components/input/index.md
index f6fb8aa0e948882984737773436c8e98afbfbc8b..896a29fb412d033960707602cf88f7234f0db3d6 100644
--- a/packages/devui-vue/docs/components/input/index.md
+++ b/packages/devui-vue/docs/components/input/index.md
@@ -14,20 +14,20 @@
 <template>
   <h4 style="margin: 10px 0">Default</h4>
 
-  <d-input placeholder="Please Enter" autoFocus id="textInput"  class="dinput"></d-input>
+  <d-input placeholder="Please Enter" autoFocus id="textInput" class="dinput"></d-input>
 
   <h4 style="margin: 10px 0">Disabled</h4>
 
-  <d-input placeholder="Please Enter" :disabled="true"  class="dinput"></d-input>
+  <d-input placeholder="Please Enter" :disabled="true" class="dinput"></d-input>
 
   <h4 style="margin: 10px 0">Error</h4>
 
-  <d-input placeholder="Please Enter" :error="true"  class="dinput"></d-input>
+  <d-input placeholder="Please Enter" :error="true" class="dinput"></d-input>
 </template>
 <style>
-  .dinput {
-    width: 200px;
-  }
+.dinput {
+  width: 200px;
+}
 </style>
 ```
 
@@ -39,30 +39,29 @@
 
 ```vue
 <template>
-    <h4 style="margin: 10px 0">Small</h4>
+  <h4 style="margin: 10px 0">Small</h4>
 
-    <d-input size="sm" class="dinput" placeholder="Please Enter" ></d-input>
+  <d-input size="sm" class="dinput" placeholder="Please Enter"></d-input>
 
-    <h4 style="margin: 10px 0">Middle</h4>
+  <h4 style="margin: 10px 0">Middle</h4>
 
-    <d-input class="dinput" placeholder="Please Enter"></d-input>
+  <d-input class="dinput" placeholder="Please Enter"></d-input>
 
-    <h4 style="margin: 10px 0">Large</h4>
+  <h4 style="margin: 10px 0">Large</h4>
 
-    <d-input size="lg"  placeholder="Please Enter" class="dinput"></d-input>
+  <d-input size="lg" placeholder="Please Enter" class="dinput"></d-input>
 </template>
 ```
 
 :::
 
-
 ### 密码框
 
 :::demo
 
 ```vue
 <template>
-  <d-input v-model:value="searchText" class="dinput" placeholder="Please Enter" showPassword></d-input>
+  <d-input v-model="searchText" class="dinput" placeholder="Please Enter" showPassword></d-input>
 </template>
 <script>
 import { defineComponent, ref } from 'vue'
@@ -73,7 +72,7 @@ export default defineComponent({
     return {
       searchText
     }
-  },
+  }
 })
 </script>
 ```
@@ -82,15 +81,15 @@ export default defineComponent({
 
 ### API
 
-|    参数     |   类型   |   默认    | 说明                     | 跳转 Demo                         |
-| :---------: | :------: | :-------: | :-----------------------: | :---------------------------------: |
-|    id     | `string` |    --     | 可选，文本框 id             | [基本用法](#基本用法)  |
-|    placeholder     | `string` |  --   | 可选，文本框 placeholder     | [基本用法](#基本用法) |
-|    maxLength     | `number` |  Number.MAX_SAFE_INTEGER   | 可选，输入框的 max-length    |   |
-|    disabled    | `boolean` | false | 可选，文本框是否被禁用           | [基本用法](#基本用法)  |
-| error | `boolean` |  false   | 可选，文本框是否出现输入错误 | [基本用法](#基本用法) |
-| size | `'sm'\|''\|'lg'` |  ''   | 可选，文本框尺寸，有三种选择`'lg'`,`''`,`'sm'` | [尺寸](#尺寸) |
-| cssClass | `string` |  ''  | 可选，支持传入类名到输入框上 |  |
-| showPassword | `boolean` |  false  | 可选，密码输入框 |  [密码框](#密码框)  |
-|  autoFocus   | `boolean` | false | 可选，输入框是否自动对焦 | [基本用法](#基本用法)  |
-
+|         参数          |       类型       |          默认           |                      说明                      |       跳转 Demo       |
+| :-------------------: | :--------------: | :---------------------: | :--------------------------------------------: | :-------------------: |
+|          id           |     `string`     |           --            |                可选，文本框 id                 | [基本用法](#基本用法) |
+| modelValue \/ v-model |     `string`     |           ''            |                     绑定值                     |   [密码框](#密码框)   |
+|      placeholder      |     `string`     |           --            |            可选，文本框 placeholder            | [基本用法](#基本用法) |
+|       maxLength       |     `number`     | Number.MAX_SAFE_INTEGER |           可选，输入框的 max-length            |                       |
+|       disabled        |    `boolean`     |          false          |             可选，文本框是否被禁用             | [基本用法](#基本用法) |
+|         error         |    `boolean`     |          false          |          可选，文本框是否出现输入错误          | [基本用法](#基本用法) |
+|         size          | `'sm'\|''\|'lg'` |           ''            | 可选，文本框尺寸，有三种选择`'lg'`,`''`,`'sm'` |     [尺寸](#尺寸)     |
+|       cssClass        |     `string`     |           ''            |          可选，支持传入类名到输入框上          |                       |
+|     showPassword      |    `boolean`     |          false          |                可选，密码输入框                |   [密码框](#密码框)   |
+|       autoFocus       |    `boolean`     |          false          |            可选，输入框是否自动对焦            | [基本用法](#基本用法) |