Browse Source

fix: com props

richard1015 4 years ago
parent
commit
0dde45955d

+ 1 - 1
src/config.json

@@ -402,7 +402,7 @@
           "sort": 2,
           "cName": "菜单组件",
           "type": "component",
-          "show": true,
+          "show": false,
           "desc": "下拉菜单组件",
           "author": "vickyYE"
         },

+ 10 - 5
src/packages/avatar/demo.vue

@@ -6,19 +6,23 @@
       <nut-avatar
         size="80"
         bg-image="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
-      ></nut-avatar>
+      >
+      </nut-avatar>
       <nut-avatar
         size="large"
         bg-image="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
-      ></nut-avatar>
+      >
+      </nut-avatar>
       <nut-avatar
         size="normal"
         bg-image="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
-      ></nut-avatar>
+      >
+      </nut-avatar>
       <nut-avatar
         size="small"
         bg-image="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
-      ></nut-avatar>
+      >
+      </nut-avatar>
     </nut-cell>
     <h2>修改形状</h2>
     <!-- <p>内置"small","normal","large"三种尺寸规格</p> -->
@@ -34,7 +38,8 @@
     <nut-cell>
       <nut-avatar
         bg-icon="https://img30.360buyimg.com/uba/jfs/t1/84318/29/2102/10483/5d0704c1Eb767fa74/fc456b03fdd6cbab.png"
-      ></nut-avatar>
+      >
+      </nut-avatar>
     </nut-cell>
     <h2>可以修改头像的内容</h2>
     <nut-cell>

+ 31 - 31
src/packages/avatar/doc.md

@@ -22,29 +22,29 @@ app.use(Avatar);
 内置 smal / normal / large 三种尺寸规格
 
 ``` html
-  <nut-avatar
-    size="80"
-    bg-image="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
-  ></nut-avatar>
-  <nut-avatar
-    size="large"
-    bg-image="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
-  ></nut-avatar>
-  <nut-avatar
-    size="normal"
-    bg-image="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
-  ></nut-avatar>
-  <nut-avatar
-    size="small"
-    bg-image="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
-  ></nut-avatar>  
+<nut-avatar
+  size="80"
+  bg-image="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
+></nut-avatar>
+<nut-avatar
+  size="large"
+  bg-image="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
+></nut-avatar>
+<nut-avatar
+  size="normal"
+  bg-image="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
+></nut-avatar>
+<nut-avatar
+  size="small"
+  bg-image="https://img12.360buyimg.com/imagetools/jfs/t1/143702/31/16654/116794/5fc6f541Edebf8a57/4138097748889987.png"
+></nut-avatar>  
 ```
 
 ### 修改形状类型
 
 ``` html
-  <nut-avatar  shape="square"></nut-avatar>
-  <nut-avatar  shape="round"></nut-avatar>
+<nut-avatar  shape="square"></nut-avatar>
+<nut-avatar  shape="round"></nut-avatar>
 ```
 
 ### 修改背景色
@@ -56,9 +56,9 @@ app.use(Avatar);
 ### 修改背景icon
 
 ``` html
-  <nut-avatar
-    bg-icon="https://img30.360buyimg.com/uba/jfs/t1/84318/29/2102/10483/5d0704c1Eb767fa74/fc456b03fdd6cbab.png"
-  ></nut-avatar>
+<nut-avatar
+  bg-icon="https://img30.360buyimg.com/uba/jfs/t1/84318/29/2102/10483/5d0704c1Eb767fa74/fc456b03fdd6cbab.png"
+></nut-avatar>
 ```
 
 ### 设置头像的文本内容
@@ -76,16 +76,16 @@ app.use(Avatar);
 
 ### Prop
 
-| 字段 |说明|类型|默认值|
-|--|--|--|--|
-|bg-color|设置头像背景色|String|#eee
-|size|设置头像的大小,提供三种:large/normal/small,支持直接输入数字|String|normal
-|shape|设置头像的形状,默认是圆形,可以设置为square方形|String|round
-|bg-image|设置头像的背景图片|String|''
-|bg-icon|设置头像的icon图标, 优先级低于bg-image,类似Icon组件的name属性,支持名称和链接|String|''
+| 字段     | 说明                                                                          | 类型   | 默认值 |
+|----------|-------------------------------------------------------------------------------|--------|--------|
+| bg-color | 设置头像背景色                                                                | String | #eee   |
+| size     | 设置头像的大小,提供三种:large/normal/small,支持直接输入数字                | String | normal |
+| shape    | 设置头像的形状,默认是圆形,可以设置为square方形                              | String | round  |
+| bg-image | 设置头像的背景图片                                                            | String | ''     |
+| bg-icon  | 设置头像的icon图标, 优先级低于bg-image,类似Icon组件的name属性,支持名称和链接 | String | ''     |
 
 ### Events
 
-|字段|说明|类型|回调参数|
-|--|--|--|--|
-|active-avatar|点击头像触发事件|Function|event|
+| 字段          | 说明             | 类型     | 回调参数 |
+|---------------|------------------|----------|----------|
+| active-avatar | 点击头像触发事件 | Function | event    |

+ 3 - 3
src/packages/checkbox/demo.vue

@@ -44,14 +44,14 @@
     </div>
     <h4>禁用动效</h4>
     <div class="show-demo">
-      <nut-checkbox v-model="checkbox7" :animation="false"
+      <nut-checkbox v-model="checkbox7" :is-animation="false"
         >没有动效</nut-checkbox
       >
-      <p>animation属性值为false时,禁用自带动效</p>
+      <p>is-animation属性值为false时,禁用自带动效</p>
     </div>
     <h4>CheckboxGroup整体禁用动效</h4>
     <div class="show-demo">
-      <nut-checkboxgroup v-model="checkboxGroup4" :animation="false">
+      <nut-checkboxgroup v-model="checkboxGroup4" :is-animation="false">
         <nut-checkbox label="没有动效1"></nut-checkbox>
         <nut-checkbox label="没有动效2"></nut-checkbox>
       </nut-checkboxgroup>

+ 9 - 9
src/packages/checkbox/doc.md

@@ -76,10 +76,10 @@ setup() {
 
 ## 自定义尺寸
 
-内置 **small**,**base**,**large** 三种规格供使用。
+内置 **small**,**normal**,**large** 三种规格供使用。
 ```html
 <nut-checkbox v-model="checkbox1" size="small">小号1</nut-checkbox>
-<nut-checkbox v-model="checkbox2" size="base">默认</nut-checkbox>
+<nut-checkbox v-model="checkbox2" size="normal">默认</nut-checkbox>
 <nut-checkbox v-model="checkbox3" size="large">大号</nut-checkbox>
 ```
 
@@ -113,10 +113,10 @@ setup() {
 
 ## 禁用动效
 
-animation属性值为false时,禁用自带动效
+is-animation属性值为false时,禁用自带动效
 
 ```html
-<nut-checkbox v-model="checkbox" :animation="false">没有动效</nut-checkbox>
+<nut-checkbox v-model="checkbox" :is-animation="false">没有动效</nut-checkbox>
 ```
 
 ```javascript
@@ -130,7 +130,7 @@ setup() {
 ## CheckboxGroup整体禁用动效
 
 ```html
-<nut-checkboxgroup v-model="checkboxGroup" :animation="false">
+<nut-checkboxgroup v-model="checkboxGroup" :is-animation="false">
   <nut-checkbox label="没有动效1"></nut-checkbox>
   <nut-checkbox label="没有动效2"></nut-checkbox>
 </nut-checkboxgroup>
@@ -268,18 +268,18 @@ setup() {
 | v-model | 必填项,当前选中项的选中状态,同步value | Boolean | false
 | label | 当前选中项的label值,(可不设,设置后label有值,替换插值内容) | String | -
 | checked | checkbox的checked属性 | Boolean | false
-| size | 尺寸,可选值small/base/large | String | base
+| size | 尺寸,可选值small/normal/large | String | normal
 | disabled | 是否禁用 | Boolean | false
-| animation | 是否需要动效 | Boolean | true
+| is-animation | 是否需要动效 | Boolean | true
 
 ### CheckGroup
 
 | 字段 | 说明 | 类型 | 默认值
 |----- | ----- | ----- | ----- 
 | v-model | 必填项,当前选中项的选中状态,同步value | Boolean | false
-| size | 尺寸,可选值small/base/large | String | base
+| size | 尺寸,可选值small/normal/large | String | normal
 | disabled | 是否禁用 | Boolean | false
-| animation | 是否需要动效 | Boolean | true
+| is-animation | 是否需要动效 | Boolean | true
 
 
 ## Event

+ 1 - 1
src/packages/checkbox/index.scss

@@ -51,7 +51,7 @@
   .nut-checkbox-label {
     color: #1d1e1e;
   }
-  &.nut-checkbox-size-base {
+  &.nut-checkbox-size-normal {
     input {
       width: 18px;
       height: 18px;

+ 4 - 4
src/packages/checkbox/index.vue

@@ -33,7 +33,7 @@ export default create({
     },
     size: {
       type: [String, Number, Boolean],
-      default: 'base'
+      default: 'normal'
     },
     label: {
       type: String,
@@ -60,7 +60,7 @@ export default create({
       type: Boolean,
       default: false
     },
-    animation: {
+    isAnimation: {
       type: Boolean,
       default: true
     }
@@ -105,9 +105,9 @@ export default create({
 
     const isAnimated = computed(() => {
       if (parentGroup && parentGroup.parentNode) {
-        return parentProps?.animation;
+        return parentProps?.isAnimation;
       } else {
-        return props.animation;
+        return props.isAnimation;
       }
     });
 

+ 1 - 1
src/packages/checkboxgroup/index.vue

@@ -20,7 +20,7 @@ export default create({
     },
     size: {
       type: String,
-      default: 'base'
+      default: 'normal'
     },
     animation: {
       type: Boolean,

+ 8 - 8
src/packages/input/demo.vue

@@ -2,7 +2,7 @@
   <div class="demo-nopading">
     <h2>基础用法</h2>
     <nut-input
-      v-model:value="state.val1"
+      v-model="state.val1"
       @change="change"
       @focus="focus"
       @blur="blur"
@@ -11,46 +11,46 @@
     <nut-input
       placeholder="请输入文本"
       @change="change"
-      v-model:value="state.val0"
+      v-model="state.val0"
       :require-show="true"
       label="文本"
       @clear="clear"
     />
     <h2>禁用输入框</h2>
     <nut-input
-      v-model:value="state.val2"
+      v-model="state.val2"
       @change="change"
       :disabled="true"
       label="文本"
     />
     <nut-input
-      v-model:value="state.val3"
+      v-model="state.val3"
       @change="change"
       :readonly="true"
       label="文本"
     />
     <h2>限制输入长度</h2>
     <nut-input
-      v-model:value="state.val4"
+      v-model="state.val4"
       @change="change"
       max-length="7"
       label="限制7"
     />
     <h2>自定义类型</h2>
     <nut-input
-      v-model:value="state.val0"
+      v-model="state.val0"
       @change="change"
       type="password"
       label="密码"
     />
     <nut-input
-      v-model:value="state.val5"
+      v-model="state.val5"
       @change="change"
       type="number"
       label="整数"
     />
     <nut-input
-      v-model:value="state.val6"
+      v-model="state.val6"
       @change="change"
       type="digit"
       placeholder="支持小数点的输入"

+ 8 - 8
src/packages/input/doc.md

@@ -22,7 +22,7 @@ app.use(Input);
 
 ```html
 <nut-input
-      v-model:value="state.val1"
+      v-model="state.val1"
       @change="change"
       @focus="focus"
       @blur="blur"
@@ -30,7 +30,7 @@ app.use(Input);
     />
 <nut-input placeholder="请输入文本"
       @change="change"
-      v-model:value="state.val0"
+      v-model="state.val0"
       :require-show="true"
       label="文本"
       @clear="clear"
@@ -41,21 +41,21 @@ app.use(Input);
 
 
 ```html
-<nut-input v-model:value="state.val2" @change="change"  disabled="true" label="标题:"/>
-<nut-input v-model:value="state.val3" @change="change" readonly="true"  label="标题:"/>
+<nut-input v-model="state.val2" @change="change"  disabled="true" label="标题:"/>
+<nut-input v-model="state.val3" @change="change" readonly="true"  label="标题:"/>
 ```
 
 ### 限制输入长度
 
 ```html
- <nut-input v-model:value="state.val4" @change="change" max-length="7" label="限制7" />
+ <nut-input v-model="state.val4" @change="change" max-length="7" label="限制7" />
 ```
 ### 其他类型
 
 ```html
-<nut-input v-model:value="state.val0" @change="change" type="password" label="密码"/>
-<nut-input v-model:value="state.val5" @change="change" type="number" label="整数" />
-<nut-input v-model:value="state.val6" @change="change" type="digit" placeholder="支持小数点的输入" label="数字"/>
+<nut-input v-model="state.val0" @change="change" type="password" label="密码"/>
+<nut-input v-model="state.val5" @change="change" type="number" label="整数" />
+<nut-input v-model="state.val6" @change="change" type="digit" placeholder="支持小数点的输入" label="数字"/>
 ```
 
 

+ 14 - 14
src/packages/radio/demo.vue

@@ -2,18 +2,18 @@
   <div class="demo-list">
     <h4>Radio基本用法</h4>
     <div class="show-demo">
-      <nut-radio v-model:value="radioVal" :label="2">备选项</nut-radio>
+      <nut-radio v-model="radioVal" :label="2">备选项</nut-radio>
     </div>
     <h4>组合使用Radio</h4>
     <div class="show-demo">
-      <nut-radio v-model:value="radioVal1" :label="1">备选项1</nut-radio>
-      <nut-radio v-model:value="radioVal1" :label="2">备选项2</nut-radio>
+      <nut-radio v-model="radioVal1" :label="1">备选项1</nut-radio>
+      <nut-radio v-model="radioVal1" :label="2">备选项2</nut-radio>
       <span>radioVal1: {{ radioVal1 }} </span>
     </div>
 
     <h4>RadioGroup基本用法</h4>
     <div class="show-demo">
-      <nut-radiogroup v-model:value="radioGroupVal1">
+      <nut-radiogroup v-model="radioGroupVal1">
         <nut-radio label="a">备选项1</nut-radio>
         <nut-radio label="b">备选项2</nut-radio>
       </nut-radiogroup>
@@ -24,13 +24,13 @@
     <div class="show-demo">
       <div>
         <span>未选中时的禁用状态:</span>
-        <nut-radio :disabled="true" v-model:value="radioVal2" label="禁用"
+        <nut-radio :disabled="true" v-model="radioVal2" label="禁用"
           >备选项1</nut-radio
         >
       </div>
       <div>
         <span>已选中时的禁用状态:</span>
-        <nut-radio :disabled="true" v-model:value="radioVal2" label="选中且禁用"
+        <nut-radio :disabled="true" v-model="radioVal2" label="选中且禁用"
           >备选项2</nut-radio
         >
       </div>
@@ -38,7 +38,7 @@
 
     <h4>RadioGroup整体禁用</h4>
     <div class="show-demo">
-      <nut-radiogroup v-model:value="radioGroupVal2" :disabled="true">
+      <nut-radiogroup v-model="radioGroupVal2" :disabled="true">
         <nut-radio label="1">备选项1</nut-radio>
         <nut-radio label="2">备选项2</nut-radio>
         <nut-radio label="3">备选项3</nut-radio>
@@ -55,7 +55,7 @@
 
     <h4>RadioGroup整体定义尺寸</h4>
     <div class="show-demo">
-      <nut-radiogroup v-model:value="radioGroupVal3" size="large">
+      <nut-radiogroup v-model="radioGroupVal3" size="large">
         <nut-radio label="1">备选项1</nut-radio>
         <nut-radio label="2">备选项2</nut-radio>
         <nut-radio label="3">备选项3</nut-radio>
@@ -64,18 +64,18 @@
 
     <h4>Radio禁用动效</h4>
     <div class="show-demo">
-      <nut-radio :animated="false" v-model:value="radioVal3" label="a"
+      <nut-radio :is-animated="false" v-model="radioVal3" label="a"
         >备选项1</nut-radio
       >
-      <nut-radio :animated="false" v-model:value="radioVal3" label="b"
+      <nut-radio :is-animated="false" v-model="radioVal3" label="b"
         >备选项2</nut-radio
       >
-      <p>animated 属性值为 false 时,禁用自带动效</p>
+      <p>is-animated 属性值为 false 时,禁用自带动效</p>
     </div>
 
     <h4>RadioGroup禁用动效</h4>
     <div class="show-demo">
-      <nut-radiogroup v-model:value="radioGroupVal4" :animated="false">
+      <nut-radiogroup v-model="radioGroupVal4" :is-animated="false">
         <nut-radio label="a">备选项1</nut-radio>
         <nut-radio label="b">备选项2</nut-radio>
         <nut-radio label="c">备选项3</nut-radio>
@@ -85,12 +85,12 @@
     <h4>自定义Class</h4>
     <div class="show-demo">
       <div>
-        <nut-radio class="my-radio" v-model:value="radioVal5" label="a"
+        <nut-radio class="my-radio" v-model="radioVal5" label="a"
           >备选项1</nut-radio
         >
       </div>
       <div>
-        <nut-radio class="my-radio" v-model:value="radioVal5" label="b"
+        <nut-radio class="my-radio" v-model="radioVal5" label="b"
           >备选项2</nut-radio
         >
       </div>

+ 14 - 14
src/packages/radio/doc.md

@@ -4,7 +4,7 @@
 
 通过 **v-model** 绑定值当前选中项的 **label** ,二者一致时 **Radio** 选中。
 ```html
-<nut-radio v-model:value="radioVal" :label="b">备选项1</nut-radio>
+<nut-radio v-model="radioVal" :label="b">备选项1</nut-radio>
 ```
 ```javascript
 setup() {
@@ -17,8 +17,8 @@ setup() {
 ## 组合使用 Radio
 
 ```html
-<nut-radio v-model:value="radioVal" :label="1">备选项1</nut-radio>
-<nut-radio v-model:value="radioVal" :label="2">备选项2</nut-radio>
+<nut-radio v-model="radioVal" :label="1">备选项1</nut-radio>
+<nut-radio v-model="radioVal" :label="2">备选项2</nut-radio>
 ```
 ```javascript
 setup() {
@@ -31,7 +31,7 @@ setup() {
 ## RadioGroup基本用法
 
 ```html
-<nut-radiogroup v-model:value="radioGroupVal">
+<nut-radiogroup v-model="radioGroupVal">
   <nut-radio label="a">备选项1</nut-radio>
   <nut-radio label="b">备选项2</nut-radio>
 </nut-radiogroup>
@@ -56,7 +56,7 @@ setup() {
 ## RadioGroup 整体禁用
 
 ```html
-<nut-radiogroup v-model:value="radioGroupVal" :animated="false">
+<nut-radiogroup v-model="radioGroupVal" :is-animated="false">
   <nut-radio label="a">备选项1</nut-radio>
   <nut-radio label="b">备选项2</nut-radio>
   <nut-radio label="c">备选项3</nut-radio>
@@ -85,7 +85,7 @@ setup() {
 内置 **small**,**base**,**large** 三种规格供使用。
 
 ```html
-<nut-radiogroup v-model:value="radioGroupVal" size="large">
+<nut-radiogroup v-model="radioGroupVal" size="large">
   <nut-radio label="1">备选项1</nut-radio>
   <nut-radio label="2">备选项2</nut-radio>
   <nut-radio label="3">备选项3</nut-radio>
@@ -101,11 +101,11 @@ setup() {
 
 ## 禁用动效
 
-通过给 **animated** 传布尔值 **false** ,禁用自带动效
+通过给 **is-animated** 传布尔值 **false** ,禁用自带动效
 
 ```html
-<nut-radio :animated="false" v-model:value="radioVal" label="a">备选项1</nut-radio>
-<nut-radio :animated="false" v-model:value="radioVal" label="b">备选项2</nut-radio>
+<nut-radio :is-animated="false" v-model="radioVal" label="a">备选项1</nut-radio>
+<nut-radio :is-animated="false" v-model="radioVal" label="b">备选项2</nut-radio>
 ```
 ```javascript
 setup() {
@@ -118,7 +118,7 @@ setup() {
 ## RadioGroup 禁用动效
 
 ```html
-<nut-radiogroup v-model:value="radioGroupVal" :animated="false">
+<nut-radiogroup v-model="radioGroupVal" :is-animated="false">
   <nut-radio label="a">备选项1</nut-radio>
   <nut-radio label="b">备选项2</nut-radio>
   <nut-radio label="c">备选项3</nut-radio>
@@ -145,20 +145,20 @@ setup() {
 
 | 字段 | 说明 | 类型 | 默认值
 |----- | ----- | ----- | ----- 
-| v-model:value | 当前选中项的标识符,与label值一致时呈选中状态 | 任意类型 | -
+| v-model | 当前选中项的标识符,与label值一致时呈选中状态 | 任意类型 | -
 | label | 标识符,与v-model值一致时呈选中状态 | 任意类型 | -
 | size | 尺寸,可选值small/base/large | String | base
 | disabled | 是否禁用 | Boolean | false
-| animated | 是否需要动效 | Boolean | true
+| is-animated | 是否需要动效 | Boolean | true
 
 ### RadioGroup
 
 | 字段 | 说明 | 类型 | 默认值
 |----- | ----- | ----- | ----- 
-| v-model:value | 当前选中项的标识符,与label值一致时呈选中状态 | String、Number、Boolean | -
+| v-model | 当前选中项的标识符,与label值一致时呈选中状态 | String、Number、Boolean | -
 | size | 尺寸,可选值small/base/large | String | `base`
 | disabled | 是否禁用 | Boolean | `false`
-| animated | 是否需要动效 | Boolean | `true`
+| is-animated | 是否需要动效 | Boolean | `true`
 
 ## Event
 

+ 2 - 2
src/packages/radio/index.vue

@@ -39,7 +39,7 @@ export default create({
       type: Boolean,
       default: false
     },
-    animated: {
+    isAnimated: {
       type: Boolean,
       default: true
     }
@@ -82,7 +82,7 @@ export default create({
     });
 
     const isAnimated = computed(() => {
-      return isParentGroup ? parentProps?.animated : props.animated;
+      return isParentGroup ? parentProps?.isAnimated : props.isAnimated;
     });
 
     const clickEvt = (event: Event) => {

+ 1 - 1
src/packages/shortpassword/demo.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="demo">
     <nut-shortpassword
-      v-model:value="state.value"
+      v-model="state.value"
       v-model:visible="state.visible"
       :no-button="state.noButton"
       :length="state.length"

+ 1 - 1
src/packages/shortpassword/doc.md

@@ -20,7 +20,7 @@ app.use(ShortPassword);
 
 ``` html
 <nut-shortpassword
-  v-model:value="state.value"
+  v-model="state.value"
   v-model:visible="state.visible"
   :no-button="state.noButton"
   :length="state.length"

+ 2 - 2
src/packages/textarea/demo.vue

@@ -2,7 +2,7 @@
   <div class="demo-nopading">
     <h2>基础用法</h2>
     <nut-textarea
-      v-model:value="state.val0"
+      v-model="state.val0"
       @change="change"
       rows="10"
       placeholder="高度可拉伸"
@@ -11,7 +11,7 @@
     />
     <h2>显示字数统计</h2>
     <nut-textarea
-      v-model:value="state.val1"
+      v-model="state.val1"
       @change="change"
       rows="5"
       :limit-show="true"

+ 2 - 2
src/packages/textarea/doc.md

@@ -21,7 +21,7 @@ app.use(Textarea);
 
 ```html
 <nut-textarea
-  v-model:value="state.val0"
+  v-model="state.val0"
   @change="change"
   rows="5"
   placeholder="高度可拉伸"
@@ -35,7 +35,7 @@ app.use(Textarea);
 
 ```html
  <nut-textarea
-  v-model:value="state.val1"
+  v-model="state.val1"
   @change="change"
   rows="5"
   :limit-show="true"

+ 5 - 5
src/packages/uploader/demo.vue

@@ -5,12 +5,12 @@
     <h2>上传状态</h2>
     <nut-uploader :url="uploadUrl" multiple @delete="onDelete"></nut-uploader>
     <h2>限制上传数量5个</h2>
-    <nut-uploader :url="uploadUrl" multiple max-count="5"></nut-uploader>
+    <nut-uploader :url="uploadUrl" multiple maximum="5"></nut-uploader>
     <h2>限制上传大小(每个文件最大不超过 50kb)</h2>
     <nut-uploader
       :url="uploadUrl"
       multiple
-      :max-size="1024 * 50"
+      :maximize="1024 * 50"
       @oversize="onOversize"
     ></nut-uploader>
     <h2>限制上传大小(在beforeupload钩子中处理)</h2>
@@ -18,15 +18,15 @@
       :url="uploadUrl"
       multiple
       :before-upload="beforeUpload"
-      :max-size="1024 * 50"
+      :maximize="1024 * 50"
       @oversize="onOversize"
     ></nut-uploader>
     <h2>自定义数据 FormData 、 headers </h2>
     <nut-uploader
       :url="uploadUrl"
-      :form-data="formData"
+      :data="formData"
       :headers="formData"
-      :with-Credentials="true"
+      :with-credentials="true"
     ></nut-uploader>
     <h2>禁用状态</h2>
     <nut-uploader disabled></nut-uploader>

+ 7 - 7
src/packages/uploader/doc.md

@@ -25,12 +25,12 @@ app.use(Uploader);
 ### 限制上传数量5个
 
 ``` html
-<nut-uploader url="http://服务器地址" multiple max-count="5"></nut-uploader>
+<nut-uploader url="http://服务器地址" multiple maximum="5"></nut-uploader>
 ```
 ### 限制上传大小(每个文件最大不超过 50kb,也可以在beforeupload中自行处理)
 
 ``` html
-<nut-uploader url="http://服务器地址" multiple :max-size="1024 * 50" :before-upload="beforeUpload" @oversize="onOversize"></nut-uploader>
+<nut-uploader url="http://服务器地址" multiple :maximize="1024 * 50" :before-upload="beforeUpload" @oversize="onOversize"></nut-uploader>
 ```
 
 ``` javascript
@@ -57,7 +57,7 @@ setup() {
 ### 自定义 FormData headers
 
 ``` html
-<nut-uploader url="http://服务器地址" :form-data="formData" :headers="formData" :with-Credentials="true"></nut-uploader>
+<nut-uploader url="http://服务器地址" :data="formData" :headers="formData" :with-Credentials="true"></nut-uploader>
 ```
 
 ``` javascript
@@ -95,12 +95,12 @@ setup() {
 | is-deletable      | 是否展示删除按钮                                                                                                                                                                       | Boolean                           | true        |
 | method            | 上传请求的 http method                                                                                                                                                                 | String                            | "post"      |
 | capture           | 图片[选取模式](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/input#htmlattrdefcapture),可选值为 camera (直接调起摄像头)                                                   | String                            | "camera"    |
-| max-size          | 可以设定最大上传文件的大小(字节)                                                                                                                                                     | Number丨String                    | Number.MAX_VALUE           |
-| max-count         | 文件上传数量限制                                                                                                                                                                       | Number丨String                    | 1           |
+| maximize          | 可以设定最大上传文件的大小(字节)                                                                                                                                                     | Number丨String                    | Number.MAX_VALUE           |
+| maximum         | 文件上传数量限制                                                                                                                                                                       | Number丨String                    | 1           |
 | clear-input       | 是否需要清空`input`内容,设为`true`支持重复选择上传同一个文件                                                                                                                          | Boolean                           | false       |
-| accept-type       | 允许上传的文件类型,[详细说明](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/Input/file#%E9%99%90%E5%88%B6%E5%85%81%E8%AE%B8%E7%9A%84%E6%96%87%E4%BB%B6%E7%B1%BB%E5%9E%8B) | String                            | *           |
+| accept       | 允许上传的文件类型,[详细说明](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/Input/file#%E9%99%90%E5%88%B6%E5%85%81%E8%AE%B8%E7%9A%84%E6%96%87%E4%BB%B6%E7%B1%BB%E5%9E%8B) | String                            | image/*           |
 | headers           | 设置上传的请求头部                                                                                                                                                                     | Object                            | {}          |
-| form-data         | 附加上传的信息 formData                                                                                                                                                                | Object                            | {}          |
+| data         | 附加上传的信息 formData                                                                                                                                                                | Object                            | {}          |
 | upload-icon       | 上传区域[图标名称](#/zh-CN/icon)或图片链接                                                                                                                                             | String                            | "photograph"  |
 | xhr-state         | 接口响应的成功状态(status)值                                                                                                                                                         | Number                            | 200         |
 | with-credentials  | 支持发送 cookie 凭证信息                                                                                                                                                               | Boolean                           | fasle       |

+ 12 - 12
src/packages/uploader/index.vue

@@ -15,12 +15,12 @@
         }}</view>
       </view>
     </view>
-    <view class="upload" v-if="maxCount - fileList.length">
+    <view class="upload" v-if="maximum - fileList.length">
       <nut-icon color="#808080" :name="uploadIcon"></nut-icon>
       <input
         type="file"
         :capture="capture"
-        :accept="acceptType"
+        :accept="accept"
         :multiple="multiple"
         :name="name"
         :disabled="disabled"
@@ -59,12 +59,12 @@ export default create({
     isDeletable: { type: Boolean, default: true },
     method: { type: String, default: 'post' },
     capture: { type: String, default: 'camera' },
-    maxSize: { type: [Number, String], default: Number.MAX_VALUE },
-    maxCount: { type: [Number, String], default: 1 },
+    maximize: { type: [Number, String], default: Number.MAX_VALUE },
+    maximum: { type: [Number, String], default: 1 },
     clearInput: { type: Boolean, default: false },
-    acceptType: { type: String, default: '*' },
+    accept: { type: String, default: 'image/*' },
     headers: { type: Object, default: {} },
-    formData: { type: Object, default: {} },
+    data: { type: Object, default: {} },
     uploadIcon: { type: String, default: 'photograph' },
     xhrState: { type: [Number, String], default: 200 },
     withCredentials: { type: Boolean, default: false },
@@ -108,7 +108,7 @@ export default create({
     const executeUpload = (fileItem: FileItem) => {
       const uploadOption = new UploadOptions();
       uploadOption.url = props.url;
-      for (const [key, value] of Object.entries(props.formData)) {
+      for (const [key, value] of Object.entries(props.data)) {
         fileItem.formData.append(key, value);
       }
       uploadOption.formData = fileItem.formData;
@@ -177,11 +177,11 @@ export default create({
     };
 
     const filterFiles = (files: File[]) => {
-      const maxCount = (props.maxCount as number) * 1;
-      const maxSize = (props.maxSize as number) * 1;
+      const maximum = (props.maximum as number) * 1;
+      const maximize = (props.maximize as number) * 1;
       const oversizes = new Array<File>();
       files = files.filter((file: File) => {
-        if (file.size > maxSize) {
+        if (file.size > maximize) {
           oversizes.push(file);
           return false;
         } else {
@@ -191,8 +191,8 @@ export default create({
       if (oversizes.length) {
         emit('oversize', oversizes);
       }
-      if (files.length > maxCount) {
-        files.splice(maxCount - 1, files.length - maxCount);
+      if (files.length > maximum) {
+        files.splice(maximum - 1, files.length - maximum);
       }
       return files;
     };