From 2fea1832e6a0360b37ca50df01b57ff403068839 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=88=98=E8=BF=AA?= <liudi@cethik.com>
Date: Tue, 30 Nov 2021 09:13:56 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E4=BF=AE=E5=A4=8D=E5=9B=A0d-input=E5=8F=8C?=
 =?UTF-8?q?=E5=90=91=E7=BB=91=E5=AE=9A=E5=80=BC=E4=BF=AE=E6=94=B9=E4=BA=A7?=
 =?UTF-8?q?=E7=94=9F=E7=9A=84=E4=B8=80=E7=B3=BB=E5=88=97=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../devui-vue/devui/cascader/src/cascader.tsx |  2 +-
 .../devui/date-picker/date-picker.tsx         |  2 +-
 .../pagination/src/components/jump-page.tsx   |  4 +-
 .../devui-vue/docs/components/form/index.md   | 64 +++++++++----------
 .../docs/components/input-icon/index.md       | 26 ++++----
 .../docs/components/pagination/index.md       | 18 +++---
 6 files changed, 58 insertions(+), 58 deletions(-)

diff --git a/packages/devui-vue/devui/cascader/src/cascader.tsx b/packages/devui-vue/devui/cascader/src/cascader.tsx
index 2cc6e437..a0e87f10 100644
--- a/packages/devui-vue/devui/cascader/src/cascader.tsx
+++ b/packages/devui-vue/devui/cascader/src/cascader.tsx
@@ -144,7 +144,7 @@ export default defineComponent({
             : <d-input
                 disabled={props.disabled}
                 placeholder={props.placeholder}
-                value={inputValue.value}
+                modelValue={inputValue.value}
               ></d-input>
           }
           <div class="devui-cascader__icon devui-drop-icon-animation">
diff --git a/packages/devui-vue/devui/date-picker/date-picker.tsx b/packages/devui-vue/devui/date-picker/date-picker.tsx
index fd11fe99..1b67f193 100644
--- a/packages/devui-vue/devui/date-picker/date-picker.tsx
+++ b/packages/devui-vue/devui/date-picker/date-picker.tsx
@@ -94,7 +94,7 @@ export default defineComponent({
             <Input
               ref={input}
               class="datepicker-input"
-              value={state.value}
+              modelValue={state.value}
               placeholder={state.placeholder}
               onFocus={() => state.show = true }
             />
diff --git a/packages/devui-vue/devui/pagination/src/components/jump-page.tsx b/packages/devui-vue/devui/pagination/src/components/jump-page.tsx
index a4e7e2f8..9b88299f 100644
--- a/packages/devui-vue/devui/pagination/src/components/jump-page.tsx
+++ b/packages/devui-vue/devui/pagination/src/components/jump-page.tsx
@@ -76,8 +76,8 @@ export default defineComponent({
         <d-input
           class={['devui-pagination-input', size ? 'devui-pagination-input-' + size : '']}
           size={size}
-          value={String(inputNum)}
-          onUpdate:value={jumpPageChange}
+          modelValue={String(inputNum)}
+          onUpdate:modelValue={jumpPageChange}
           onKeydown={jump}
         /> 
 
diff --git a/packages/devui-vue/docs/components/form/index.md b/packages/devui-vue/docs/components/form/index.md
index 9b65e478..13591a26 100644
--- a/packages/devui-vue/docs/components/form/index.md
+++ b/packages/devui-vue/docs/components/form/index.md
@@ -23,13 +23,13 @@
     <d-form-item prop="name">
       <d-form-label required hasHelp helpTips="名字可以随意填">Name</d-form-label>
       <d-form-control extraInfo="这行是说明文字，可以不用理，你尽管填你的姓名。">
-        <d-input v-model:value="formModel.name" />
+        <d-input v-model="formModel.name" />
       </d-form-control>
     </d-form-item>
     <d-form-item prop="age">
       <d-form-label>Age</d-form-label>
       <d-form-control>
-        <d-input v-model:value="formModel.age" />
+        <d-input v-model="formModel.age" />
       </d-form-control>
     </d-form-item>
     <d-form-item prop="city">
@@ -153,19 +153,19 @@ Label左右布局方式。
     <d-form-item prop="name">
       <d-form-label required>Name</d-form-label>
       <d-form-control>
-        <d-input v-model:value="formModel.name" />
+        <d-input v-model="formModel.name" />
       </d-form-control>
     </d-form-item>
     <d-form-item prop="age">
       <d-form-label>Age</d-form-label>
       <d-form-control>
-        <d-input v-model:value="formModel.age" />
+        <d-input v-model="formModel.age" />
       </d-form-control>
     </d-form-item>
     <d-form-item prop="city">
       <d-form-label>City</d-form-label>
       <d-form-control>
-        <d-select v-model:value="formModel.city" :options="selectOptions" />
+        <d-select v-model="formModel.city" :options="selectOptions" />
       </d-form-control>
     </d-form-item>
     <d-form-item prop="loveFruits">
@@ -284,19 +284,19 @@ export default defineComponent({
       <d-form-item prop="name">
         <d-form-label required>Name</d-form-label>
         <d-form-control>
-          <d-input v-model:value="formModel.name" />
+          <d-input v-model="formModel.name" />
         </d-form-control>
       </d-form-item>
       <d-form-item prop="age">
         <d-form-label>Age</d-form-label>
         <d-form-control>
-          <d-input v-model:value="formModel.age" />
+          <d-input v-model="formModel.age" />
         </d-form-control>
       </d-form-item>
       <d-form-item prop="city">
         <d-form-label>City</d-form-label>
         <d-form-control>
-          <d-select v-model:value="formModel.city" :options="selectOptions" />
+          <d-select v-model="formModel.city" :options="selectOptions" />
         </d-form-control>
       </d-form-item>
       <d-form-item prop="loveFruits">
@@ -574,7 +574,7 @@ export default defineComponent({
     <d-form-item prop="name">
       <d-form-label required>Name</d-form-label>
       <d-form-control>
-        <d-input v-model:value="formModel.name" v-d-validate-rules="[
+        <d-input v-model="formModel.name" v-d-validate-rules="[
           {
             maxlength: 8,
           },
@@ -640,7 +640,7 @@ export default defineComponent({
     <d-form-item prop="sum">
       <d-form-label>计算：1 + 1 = ？</d-form-label>
       <d-form-control>
-        <d-input v-model:value="formModel.sum" v-d-validate-rules="{
+        <d-input v-model="formModel.sum" v-d-validate-rules="{
           validators: [
             {message: '不对喔！', validator: customValidator},
             {message: '答对啦！', validator: customValidator2}
@@ -651,7 +651,7 @@ export default defineComponent({
     <d-form-item prop="asyncSum">
       <d-form-label>计算：1 + 2 = ？（async）</d-form-label>
       <d-form-control>
-        <d-input v-model:value="formModel.asyncSum" v-d-validate-rules="{
+        <d-input v-model="formModel.asyncSum" v-d-validate-rules="{
           asyncValidators: [
             {message: '不对喔！（async）', asyncValidator: customAsyncValidator},
             {message: '答对啦！（async）', asyncValidator: customAsyncValidator2}
@@ -731,7 +731,7 @@ export default defineComponent({
     <d-form-item prop="sum">
       <d-form-label>计算：1 + 1 = ？</d-form-label>
       <d-form-control extraInfo="updateOn为change，当输入完成时，输入框的值发生改变。此时触发验证规则">
-        <d-input v-model:value="formModel.sum" v-d-validate-rules="{
+        <d-input v-model="formModel.sum" v-d-validate-rules="{
           rules: {
             validators: [
               {message: '不对喔！', validator: customValidator},
@@ -747,7 +747,7 @@ export default defineComponent({
     <d-form-item prop="asyncSum">
       <d-form-label>计算：1 + 2 = ？（async）</d-form-label>
       <d-form-control extraInfo="updateOn为input，当正在输入时，输入框的值发生改变。此时触发验证规则">
-        <d-input v-model:value="formModel.asyncSum" v-d-validate-rules="{
+        <d-input v-model="formModel.asyncSum" v-d-validate-rules="{
           rules: {
             asyncValidators: [
               {message: '不对喔！（async）', asyncValidator: customAsyncValidator},
@@ -763,7 +763,7 @@ export default defineComponent({
     <d-form-item prop="errorSum">
       <d-form-label>计算：1 + 1 = ？</d-form-label>
       <d-form-control extraInfo="errorStrategy为pristine，初始化时触发验证规则">
-        <d-input v-model:value="formModel.errorSum" v-d-validate-rules="{
+        <d-input v-model="formModel.errorSum" v-d-validate-rules="{
           errorStrategy: 'pristine',
           rules: {
             validators: [
@@ -858,7 +858,7 @@ export default defineComponent({
     <d-form-item prop="sum">
       <d-form-label>计算：1 + 1 = ？</d-form-label>
       <d-form-control extraInfo="messageShowType为none，不显示提示文字">
-        <d-input v-model:value="formModel.sum" v-d-validate-rules="{
+        <d-input v-model="formModel.sum" v-d-validate-rules="{
           messageShowType: 'none',
           rules: {
             validators: [
@@ -874,7 +874,7 @@ export default defineComponent({
     <d-form-item prop="asyncSum">
       <d-form-label>计算：1 + 2 = ？</d-form-label>
       <d-form-control extraInfo="messageShowType为popover，使用popover进行提示">
-        <d-input v-model:value="formModel.asyncSum" v-d-validate-rules="{
+        <d-input v-model="formModel.asyncSum" v-d-validate-rules="{
           rules: {
             asyncValidators: [
               {message: '不对喔！（async）', asyncValidator: customAsyncValidator}
@@ -954,7 +954,7 @@ export default defineComponent({
     <d-form-item prop="asyncSum">
       <d-form-label>计算：1 + 2 = ？（async）</d-form-label>
       <d-form-control extraInfo="asyncDebounceTime为500">
-        <d-input v-model:value="formModel.asyncSum" v-d-validate-rules="{
+        <d-input v-model="formModel.asyncSum" v-d-validate-rules="{
           rules: {
             asyncValidators: [
               {message: '不对喔！（async）', asyncValidator: customAsyncValidator}
@@ -1023,7 +1023,7 @@ export default defineComponent({
     <d-form-item prop="name">
       <d-form-label>Name</d-form-label>
       <d-form-control>
-        <d-input v-model:value="formModel.name" v-d-validate-rules="{
+        <d-input v-model="formModel.name" v-d-validate-rules="{
           rules: {minlength: 2, message: '不能小于2个字符'},
           options: {
             updateOn: 'input',
@@ -1034,7 +1034,7 @@ export default defineComponent({
     <d-form-item prop="age">
       <d-form-label>Age</d-form-label>
       <d-form-control>
-        <d-input v-model:value="formModel.age" v-d-validate-rules="{
+        <d-input v-model="formModel.age" v-d-validate-rules="{
           rules: {min: 1, message: '年龄需大于0'},
           options: {
             updateOn: 'input',
@@ -1111,7 +1111,7 @@ export default defineComponent({
     <d-form-item prop="name">
       <d-form-label>Name</d-form-label>
       <d-form-control>
-        <d-input v-model:value="formModel.name" v-d-validate-rules="{
+        <d-input v-model="formModel.name" v-d-validate-rules="{
           rules: {minlength: 2, message: '不能小于2个字符'},
           options: {
             updateOn: 'input',
@@ -1122,7 +1122,7 @@ export default defineComponent({
     <d-form-item prop="age">
       <d-form-label>Age</d-form-label>
       <d-form-control>
-        <d-input v-model:value="formModel.age" v-d-validate-rules="{
+        <d-input v-model="formModel.age" v-d-validate-rules="{
           rules: {min: 1, message: '年龄需大于0'},
           options: {
             updateOn: 'input',
@@ -1196,13 +1196,13 @@ export default defineComponent({
     <d-form-item prop="name">
       <d-form-label :required="true" >Name</d-form-label>
       <d-form-control>
-        <d-input v-model:value="validateFormModel.name" />
+        <d-input v-model="validateFormModel.name" />
       </d-form-control>
     </d-form-item>
     <d-form-item prop="age">
       <d-form-label :required="true" >Age</d-form-label>
       <d-form-control>
-        <d-input v-model:value="validateFormModel.age" />
+        <d-input v-model="validateFormModel.age" />
       </d-form-control>
     </d-form-item>
   </d-form>
@@ -1277,19 +1277,19 @@ export default defineComponent({
     <d-form-item prop="name">
       <d-form-label :required="true" >Name</d-form-label>
       <d-form-control feedbackStatus="pending">
-        <d-input v-model:value="formModel.name" />
+        <d-input v-model="formModel.name" />
       </d-form-control>
     </d-form-item>
     <d-form-item prop="nickname">
       <d-form-label :required="true" >Nickname</d-form-label>
       <d-form-control feedbackStatus="success">
-        <d-input v-model:value="formModel.nickname" />
+        <d-input v-model="formModel.nickname" />
       </d-form-control>
     </d-form-item>
     <d-form-item prop="age">
       <d-form-label :required="true" >Age</d-form-label>
       <d-form-control feedbackStatus="error">
-        <d-input v-model:value="formModel.age" />
+        <d-input v-model="formModel.age" />
       </d-form-control>
     </d-form-item>
     <d-form-item prop="sex">
@@ -1354,7 +1354,7 @@ export default defineComponent({
     <d-form-item prop="address">
       <d-form-label :required="true" >Address</d-form-label>
       <d-form-control>
-        <d-input v-model:value="formModel.address" />
+        <d-input v-model="formModel.address" />
         <template v-slot:suffixTemplate>
           <d-icon name="right-o" color="rgb(61, 204, 166)" />
         </template>
@@ -1401,19 +1401,19 @@ export default defineComponent({
     <d-form-item prop="username">
       <d-form-label :required="true" >Username</d-form-label>
       <d-form-control>
-        <d-input v-model:value="formModel.username" v-d-validate-rules="formRules.userNameRule" />
+        <d-input v-model="formModel.username" v-d-validate-rules="formRules.userNameRule" />
       </d-form-control>
     </d-form-item>
     <d-form-item prop="password">
       <d-form-label :required="true" >Password</d-form-label>
       <d-form-control>
-        <d-input v-model:value="formModel.password" v-d-validate-rules="formRules.passwordRule" />
+        <d-input v-model="formModel.password" v-d-validate-rules="formRules.passwordRule" />
       </d-form-control>
     </d-form-item>
     <d-form-item prop="confirmPassword">
       <d-form-label :required="true" >Confirm Password</d-form-label>
       <d-form-control>
-        <d-input v-model:value="formModel.confirmPassword" v-d-validate-rules="formRules.confirmPasswordRule" />
+        <d-input v-model="formModel.confirmPassword" v-d-validate-rules="formRules.confirmPasswordRule" />
       </d-form-control>
     </d-form-item>
     <d-form-operation class="demo-form-operation">
@@ -1515,13 +1515,13 @@ export default defineComponent({
     <d-form-item prop="name">
       <d-form-label :required="true" >Name</d-form-label>
       <d-form-control>
-        <d-input v-model:value="formModel.name" />
+        <d-input v-model="formModel.name" />
       </d-form-control>
     </d-form-item>
     <d-form-item prop="age">
       <d-form-label :required="true" >Age</d-form-label>
       <d-form-control>
-        <d-input v-model:value="formModel.age" />
+        <d-input v-model="formModel.age" />
       </d-form-control>
     </d-form-item>
   </d-form>
diff --git a/packages/devui-vue/docs/components/input-icon/index.md b/packages/devui-vue/docs/components/input-icon/index.md
index 97067f55..86cc01dd 100644
--- a/packages/devui-vue/docs/components/input-icon/index.md
+++ b/packages/devui-vue/docs/components/input-icon/index.md
@@ -34,12 +34,12 @@ export default defineComponent({
 ```
 
 <div style="max-width:300px;border:1px dashed #ccc;padding:20px;display:flex;flex-direction:column;justify-content:space-around;height:300px;">
-<d-input-icon value="calendar" name="calendar" />
-<d-input-icon value="code" name="code" />
-<d-input-icon value="close" name="close" />
-<d-input-icon value="edit" name="edit" />
-<d-input-icon value="buy" name="buy" />
-<d-input-icon value="letter-a" name="letter-a" />
+<d-input-icon modelValue="calendar" name="calendar" />
+<d-input-icon modelValue="code" name="code" />
+<d-input-icon modelValue="close" name="close" />
+<d-input-icon modelValue="edit" name="edit" />
+<d-input-icon modelValue="buy" name="buy" />
+<d-input-icon modelValue="letter-a" name="letter-a" />
 </div>
 
 ### 属性 `icon-color` `icon-bg-color`
@@ -54,12 +54,12 @@ export default defineComponent({
 ```
 
 <div style="max-width:300px;border:1px dashed #ccc;padding:20px;display:flex;flex-direction:column;justify-content:space-around;height:300px;">
-<d-input-icon value="calendar" name="calendar" icon-bg-color="#afa" icon-color="#33a"/>
-<d-input-icon value="code" name="code" icon-bg-color="#afa" icon-color="#33a" />
-<d-input-icon value="close" name="close" icon-bg-color="#afa" icon-color="#33a" />
-<d-input-icon value="edit" name="edit" icon-bg-color="#afa" icon-color="#33a" />
-<d-input-icon value="buy" name="buy" icon-bg-color="#afa" icon-color="#33a" />
-<d-input-icon value="letter-a" name="letter-a" icon-bg-color="#afa" icon-color="#33a" />
+<d-input-icon modelValue="calendar" name="calendar" icon-bg-color="#afa" icon-color="#33a"/>
+<d-input-icon modelValue="code" name="code" icon-bg-color="#afa" icon-color="#33a" />
+<d-input-icon modelValue="close" name="close" icon-bg-color="#afa" icon-color="#33a" />
+<d-input-icon modelValue="edit" name="edit" icon-bg-color="#afa" icon-color="#33a" />
+<d-input-icon modelValue="buy" name="buy" icon-bg-color="#afa" icon-color="#33a" />
+<d-input-icon modelValue="letter-a" name="letter-a" icon-bg-color="#afa" icon-color="#33a" />
 </div>
 
 ### 事件 `onIconclick`
@@ -71,7 +71,7 @@ export default defineComponent({
 ```
 
 <div style="max-width:300px;border:1px dashed #ccc;padding:20px;display:flex;flex-direction:column;justify-content:space-around;">
-<d-input-icon name="calendar" value="click the icon --->" @iconclick="handleIconClick" />
+<d-input-icon name="calendar" modelValue="click the icon --->" @iconclick="handleIconClick" />
 </div>
 
 ### 传递原始`Input`组件属性
diff --git a/packages/devui-vue/docs/components/pagination/index.md b/packages/devui-vue/docs/components/pagination/index.md
index dad91b8a..b764ae2e 100644
--- a/packages/devui-vue/docs/components/pagination/index.md
+++ b/packages/devui-vue/docs/components/pagination/index.md
@@ -333,9 +333,9 @@ export default defineComponent({
     :maxItems="5"
   />
   <div style="display: flex; margin-top: 10px;">
-    <d-button bsStyle="primary" circled="true" size="sm" @click="setTotal(0)" :width="200">total = 0</d-button>
-    <d-button bsStyle="common" circled="true" size="sm" @click="setTotal(5)" :width="200">total = 5</d-button>
-    <d-button bsStyle="common" circled="true" size="sm" @click="setTotal(15)" :width="200">total = 15</d-button>
+    <d-button bsStyle="primary" circled="true" size="sm" @click="setTotal(0)" width="200">total = 0</d-button>
+    <d-button bsStyle="common" circled="true" size="sm" @click="setTotal(5)" width="200">total = 5</d-button>
+    <d-button bsStyle="common" circled="true" size="sm" @click="setTotal(15)" width="200">total = 15</d-button>
   </div>
 
   <h5 style="padding: 20px 0 10px;">Simple Mode</h5>
@@ -349,12 +349,12 @@ export default defineComponent({
     :lite="true"
   />
   <div style="display: flex; margin-top: 10px;">
-    <d-button bsStyle="primary" circled="true" size="sm" @click="setLiteTotal(0)" :width="200">total = 0</d-button>
-    <d-button bsStyle="common" circled="true" size="sm" @click="setLiteTotal(20)" :width="200">total = 20</d-button>
-    <d-button bsStyle="common" circled="true" size="sm" @click="setLiteTotal(30000)" :width="200">total = 30000</d-button>
-    <d-button bsStyle="common" circled="true" size="sm" @click="setLiteTotal(100000)" :width="200">total = 100000</d-button>
-    <d-button bsStyle="common" circled="true" size="sm" @click="setIndex(2)" :width="200">index = 2</d-button>
-    <d-button bsStyle="common" circled="true" size="sm" @click="setIndex(3)" :width="200">index = 3</d-button>
+    <d-button bsStyle="primary" circled="true" size="sm" @click="setLiteTotal(0)" width="200">total = 0</d-button>
+    <d-button bsStyle="common" circled="true" size="sm" @click="setLiteTotal(20)" width="200">total = 20</d-button>
+    <d-button bsStyle="common" circled="true" size="sm" @click="setLiteTotal(30000)" width="200">total = 30000</d-button>
+    <d-button bsStyle="common" circled="true" size="sm" @click="setLiteTotal(100000)" width="200">total = 100000</d-button>
+    <d-button bsStyle="common" circled="true" size="sm" @click="setIndex(2)" width="200">index = 2</d-button>
+    <d-button bsStyle="common" circled="true" size="sm" @click="setIndex(3)" width="200">index = 3</d-button>
   </div>
 </template>
 <script>
-- 
Gitee