fix(avatar,input,category,addressList): avatar input optimization and add component category addressList(#1211)

src/packages/__VUE/addresslist/doc.md

@@ -21,20 +21,95 @@ app.use(Button);
 
 ### 基础用法
 
+:::demo
+
 ```html
-<nutbiz-addresslist
-  :data="data"
-  @handelDelIcon="delClick"
-  @handelEditIcon="editClick"
-  @handelItem="itemClick"
-  :show-bottom-button="false"
-  :dataMapOptions="dataMapOptions"
->
-</nutbiz-addresslist>
+<template>
+  <nut-addresslist
+    :data="data"
+    @handelDelIcon="delClick"
+    @handelEditIcon="editClick"
+    @handelItem="itemClick"
+    :show-bottom-button="false"
+    :dataMapOptions="dataMapOptions"
+  >
+  </nut-addresslist>
+</template>
+<script lang="ts">
+import { ref, reactive } from 'vue';
+export default {
+  setup() {
+    const data = ref([
+      {
+        testid:3,
+        testaddressName:'姓名',
+        phone:'123****4567',
+        defaultAddress:false,
+        fullAddress:'北京市通州区测试测试测试测试测试测试测试测试测试'
+      },
+      {
+        testid:4,
+        testaddressName:'姓名',
+        phone:'123****4567',
+        defaultAddress:true,
+        fullAddress:'北京市通州区测试测试测试测试测试测试测试测试测试'
+      },
+    ]);
+    const dataMapOptions = reactive({
+      id: 'testid',
+      addressDetail:'testaddressDetail',
+      addressName:'testaddressName'
+    });
+    const itemClick = ()=>{
+      Toast.text('点击了地址哦～');
+    }
+    const delClick = ()=>{
+      Toast.text('点击了删除哦～');
+    }
+    const editClick = ()=>{
+      Toast.text('点击了编辑哦～');
+    }
+    return {
+      itemClick,
+      holdDownClick,
+      data,
+      delClick,
+      editClick,
+      copyClick,
+      setClick,
+      addAddress,
+      dataMapOptions
+    };
+  }
+};
+</script>
 ```
 
-```javascript
-setup() {
+:::
+### 长按功能
+
+:::demo
+
+```html
+<template>
+  <nut-addresslist
+    :data="data"
+    long-press-edition
+    :show-bottom-button="false"
+    @handelDelIcon="delClick"
+    @handelEditIcon="editClick"
+    @handelItem="itemClick"
+    @longPressCopyClick="copyClick"
+    @longPressSetClick="setClick"
+    @longPressDelClick="delClick"
+    :dataMapOptions="dataMapOptions"
+  >
+  </nut-addresslist>
+</template>
+<script lang="ts">
+import { ref, reactive } from 'vue';
+export default {
+  setup() {
     const data = ref([
         {
           testid:3,
@@ -89,43 +164,83 @@ setup() {
         dataMapOptions
       };
     }
+  };
+</script>
 ```
-
-### 长按功能
-
-```html
-<nutbiz-addresslist
-  :data="data"
-  long-press-edition
-  :show-bottom-button="false"
-  @handelDelIcon="delClick"
-  @handelEditIcon="editClick"
-  @handelItem="itemClick"
-  @longPressCopyClick="copyClick"
-  @longPressSetClick="setClick"
-  @longPressDelClick="delClick"
-  :dataMapOptions="dataMapOptions"
->
-</nutbiz-addresslist>
-```
-
+:::
 ### 滑动功能
 
+:::demo
+
 ```html
-<nutbiz-addresslist
-  :data="data"
-  swipe-edition
-  show-bottom-button
-  @handelDelIcon="delClick"
-  @handelEditIcon="editClick"
-  @handelItem="itemClick"
-  @swipeDelClick="delClick"
-  @addAddressClick="addAddress"
-  :dataMapOptions="dataMapOptions"
->
-</nutbiz-addresslist>
+<template>
+  <nut-addresslist
+    :data="data"
+    swipe-edition
+    show-bottom-button
+    @handelItem="itemClick"
+    @handelEditIcon="editClick"
+    @handelDelIcon="delClick"
+    @swipeDelClick="delClick"
+    @addAddressClick="addAddress"
+    :dataMapOptions="dataMapOptions"
+  >
+  </nut-addresslist>
+</template>
+<script lang="ts">
+import { ref, reactive } from 'vue';
+export default {
+  setup() {
+    const data = ref([
+        {
+          testid:3,
+          testaddressName:'姓名',
+          phone:'123****4567',
+          defaultAddress:false,
+          fullAddress:'北京市通州区测试测试测试测试测试测试测试测试测试'
+        },
+        {
+          testid:4,
+          testaddressName:'姓名',
+          phone:'123****4567',
+          defaultAddress:true,
+          fullAddress:'北京市通州区测试测试测试测试测试测试测试测试测试'
+        },
+      ]);
+      const dataMapOptions = reactive({
+        id: 'testid',
+        addressDetail:'testaddressDetail',
+        addressName:'testaddressName'
+      });
+      const itemClick = ()=>{
+        Toast.text('点击了地址哦～');
+      }
+      const editClick = ()=>{
+        Toast.text('点击了编辑哦～');
+      }
+      const delClick = ()=>{
+        Toast.text('点击了删除哦～');
+      }
+      const addAddress = ()=>{
+        Toast.text('添加新地址～');
+      }
+      return {
+        itemClick,
+        holdDownClick,
+        data,
+        delClick,
+        editClick,
+        copyClick,
+        setClick,
+        addAddress,
+        dataMapOptions
+      };
+    }
+  };
+</script>
 ```
 
+:::
 ## API
 
 ### Props

src/packages/__VUE/avatar/demo.vue

@@ -67,15 +67,11 @@
         <nut-avatar icon="my"></nut-avatar>
         <nut-avatar color="rgb(245, 106, 0)" bg-color="rgb(253, 227, 207)">U</nut-avatar>
         <nut-avatar icon="my"></nut-avatar>
-
-        <nut-avatar icon="my">
-          <template #maxContent>+2</template>
-        </nut-avatar>
       </nut-avatar-group>
     </nut-cell>
     <h2>组合头像可控制层级方向</h2>
     <nut-cell>
-      <nut-avatar-group max-count="3" zIndex="right">
+      <nut-avatar-group max-count="3" zIndex="right" max-content="...">
         <nut-avatar
           url="https://img12.360buyimg.com/imagetools/jfs/t1/196430/38/8105/14329/60c806a4Ed506298a/e6de9fb7b8490f38.png"
         >
@@ -83,10 +79,6 @@
         <nut-avatar icon="my"></nut-avatar>
         <nut-avatar color="rgb(245, 106, 0)" bg-color="rgb(253, 227, 207)">U</nut-avatar>
         <nut-avatar icon="my"></nut-avatar>
-
-        <nut-avatar icon="my">
-          <template #maxContent>...</template>
-        </nut-avatar>
       </nut-avatar-group>
     </nut-cell>
 

src/packages/__VUE/avatar/doc.md

@@ -135,10 +135,6 @@ Icon 和字符型可以自定义图标颜色及背景色
     <nut-avatar icon="my"></nut-avatar>
     <nut-avatar color="rgb(245, 106, 0)" bg-color="rgb(253, 227, 207)">U</nut-avatar>
     <nut-avatar icon="my"></nut-avatar>
-  
-    <nut-avatar icon="my">
-      <template #maxContent>+2</template>
-    </nut-avatar>
   </nut-avatar-group>
 </template>
 ```
@@ -154,6 +150,7 @@ Icon 和字符型可以自定义图标颜色及背景色
   <nut-avatar-group
     max-count="3"
     zIndex="right"
+    max-content="..."
   >
     <nut-avatar
       url="https://img12.360buyimg.com/imagetools/jfs/t1/196430/38/8105/14329/60c806a4Ed506298a/e6de9fb7b8490f38.png"
@@ -162,10 +159,6 @@ Icon 和字符型可以自定义图标颜色及背景色
     <nut-avatar icon="my"></nut-avatar>
     <nut-avatar color="rgb(245, 106, 0)" bg-color="rgb(253, 227, 207)">U</nut-avatar>
     <nut-avatar icon="my"></nut-avatar>
-  
-    <nut-avatar icon="my">
-      <template #maxContent>...</template>
-    </nut-avatar>
   </nut-avatar-group>
 </template>
 ```
@@ -218,23 +211,16 @@ Icon 和字符型可以自定义图标颜色及背景色
 | 字段     | 说明                                                             | 类型   | 默认值 |
 | -------- | ---------------------------------------------------------------- | ------ | ------ |
 | maxCount     | 显示的最大头像个数   | Number、String | - |
-| size         | 设置头像的大小，可选值为：large、normal、small，支持直接输入数字   | String | normal |
+| max-content  | 头像数量超出时，会出现一个头像折叠元素。该元素内容可为...、more、+N。默认为 +N | 
+| size         | 设置头像的大小，可选值为：large、normal、small，支持直接输入数字   | String | +N |
 | shape        | 设置头像的形状，可选值为：square、round            | String | round  |
 | max-bgColor  | 设置 Icon、字符类型头像的背景色                    | String | #eee   |
 | max-color    | 设置 Icon、字符类型头像的颜色                   | String | #666 |
 | span         | 设置头像之间的间距               | String | -8   |
 | zIndex       | 头像之间的层级关系，可选值为：left、right  | String | left     |
-
-### Slots
-
-| 名称    | 说明         |
-|---------|--------------|
-| maxContent | 多余头像显示内容 |
-
 ### Events
 
 | 字段             | 说明         | 类型     | 回调参数 |
 | ---------------- | ------------ | -------- | -------- |
 | active-avatar | 点击头像触发事件    | Function | event    |
-| active-max    | 点击多余头像触发事件 | Function | event    |
 | onError       | 图片加载失败的事件   | Function | event    |

src/packages/__VUE/avatar/index.taro.vue

@@ -1,26 +1,33 @@
 <template>
   <view
-    :style="styles"
+    :style="!showMax ? styles : maxStyles"
     :class="classes"
     @click="activeAvatar(e)"
     ref="avatarRef"
-    v-if="!avatarGroup?.props?.maxCount || state.index <= avatarGroup?.props?.maxCount"
+    v-if="showMax || !avatarGroup?.props?.maxCount || index <= avatarGroup?.props?.maxCount"
   >
-    <template v-if="url">
-      <img :src="url" :alt="alt" @error="onError" />
+    <template v-if="!avatarGroup?.props?.maxCount || index <= avatarGroup?.props?.maxCount">
+      <template v-if="url">
+        <img :src="url" :alt="alt" @error="onError" />
+      </template>
+      <template v-else-if="icon">
+        <nut-icon class="icon" :name="iconStyles"></nut-icon>
+      </template>
+      <view class="text" v-if="isShowText">
+        <slot></slot>
+      </view>
     </template>
-    <template v-else-if="icon">
-      <nut-icon class="icon" :name="iconStyles"></nut-icon>
+    <!-- 折叠头像 -->
+    <template v-if="showMax">
+      <view class="text">
+        {{
+          avatarGroup?.props?.maxContent
+            ? avatarGroup?.props?.maxContent
+            : `+ ${maxIndex - avatarGroup?.props?.maxCount}`
+        }}
+      </view>
     </template>
-    <view class="text" v-if="isShowText">
-      <slot></slot>
-    </view>
   </view>
-  <template v-if="avatarGroup?.props?.maxCount && state.showMax">
-    <view :style="maxStyles" :class="classes" @click="activeMax(e)">
-      <slot v-if="$slots.maxContent" name="maxContent"></slot>
-    </view>
-  </template>
 </template>
 <script lang="ts">
 import { toRefs, onMounted, computed, inject, reactive, ref } from 'vue';
@@ -57,7 +64,7 @@ export default create({
       default: ''
     }
   },
-  emits: ['active-avatar', 'active-max', 'onError'],
+  emits: ['active-avatar', 'onError'],
   setup(props, { emit, slots }) {
     const { size, shape, bgColor, color, icon } = toRefs(props);
     const sizeValue = ['large', 'normal', 'small'];
@@ -75,7 +82,7 @@ export default create({
     onMounted(() => {
       const children = avatarGroup?.avatarGroupRef?.value?.children;
       if (children) {
-        console.log('parent', avatarGroup);
+        // console.log('parent', avatarGroup);
         avatarLength(children);
       }
     });
@@ -118,10 +125,6 @@ export default create({
     const avatarLength = (children: any) => {
       state.maxIndex = children.length;
       for (let i = 0; i < children.length; i++) {
-        // if (children[i] && children[i].classList && children[i].classList[0] == 'nut-avatar') {
-        //   children[i].setAttribute('data-index', i + 1);
-
-        // }
         children[i].setAttribute('data-index', i + 1);
       }
       // state.index = avatarRef?.value?.dataset?.index;
@@ -135,10 +138,6 @@ export default create({
       emit('active-avatar', event);
     };
 
-    const activeMax = (event: any) => {
-      emit('active-max', event);
-    };
-
     const onError = (event: any) => {
       emit('onError', event);
     };
@@ -154,8 +153,7 @@ export default create({
       avatarGroup,
       visible,
       avatarRef,
-      state,
-      activeMax
+      ...toRefs(state)
     };
   }
 });

src/packages/__VUE/avatar/index.vue

@@ -1,26 +1,33 @@
 <template>
   <view
-    :style="styles"
+    :style="!showMax ? styles : maxStyles"
     :class="classes"
     @click="activeAvatar(e)"
     ref="avatarRef"
-    v-if="!avatarGroup?.props?.maxCount || state.index <= avatarGroup?.props?.maxCount"
+    v-if="showMax || !avatarGroup?.props?.maxCount || index <= avatarGroup?.props?.maxCount"
   >
-    <template v-if="url">
-      <img :src="url" :alt="alt" @error="onError" />
+    <template v-if="!avatarGroup?.props?.maxCount || index <= avatarGroup?.props?.maxCount">
+      <template v-if="url">
+        <img :src="url" :alt="alt" @error="onError" />
+      </template>
+      <template v-else-if="icon">
+        <nut-icon class="icon" :name="iconStyles"></nut-icon>
+      </template>
+      <view class="text" v-if="isShowText">
+        <slot></slot>
+      </view>
     </template>
-    <template v-else-if="icon">
-      <nut-icon class="icon" :name="iconStyles"></nut-icon>
+    <!-- 折叠头像 -->
+    <template v-if="showMax">
+      <view class="text">
+        {{
+          avatarGroup?.props?.maxContent
+            ? avatarGroup?.props?.maxContent
+            : `+ ${maxIndex - avatarGroup?.props?.maxCount}`
+        }}
+      </view>
     </template>
-    <view class="text" v-if="isShowText">
-      <slot></slot>
-    </view>
   </view>
-  <template v-if="avatarGroup?.props?.maxCount && state.showMax">
-    <view :style="maxStyles" :class="classes" @click="activeMax(e)">
-      <slot v-if="$slots.maxContent" name="maxContent"></slot>
-    </view>
-  </template>
 </template>
 <script lang="ts">
 import { toRefs, onMounted, computed, inject, reactive, ref } from 'vue';
@@ -57,7 +64,7 @@ export default create({
       default: ''
     }
   },
-  emits: ['active-avatar', 'active-max', 'onError'],
+  emits: ['active-avatar', 'onError'],
   setup(props, { emit, slots }) {
     const { size, shape, bgColor, color, icon } = toRefs(props);
     const sizeValue = ['large', 'normal', 'small'];
@@ -75,7 +82,7 @@ export default create({
     onMounted(() => {
       const children = avatarGroup?.avatarGroupRef?.value?.children;
       if (children) {
-        console.log('parent', avatarGroup);
+        // console.log('children', children);
         avatarLength(children);
       }
     });
@@ -121,7 +128,7 @@ export default create({
         if (children[i] && children[i].classList && children[i].classList[0] == 'nut-avatar') {
           children[i].setAttribute('data-index', i + 1);
         }
-        console.log('console', i, children[i]);
+        // console.log('console', i, children[i]);
       }
 
       state.index = avatarRef?.value?.dataset?.index;
@@ -134,10 +141,6 @@ export default create({
       emit('active-avatar', event);
     };
 
-    const activeMax = (event: any) => {
-      emit('active-max', event);
-    };
-
     const onError = (event: any) => {
       emit('onError', event);
     };
@@ -153,8 +156,7 @@ export default create({
       avatarGroup,
       visible,
       avatarRef,
-      state,
-      activeMax
+      ...toRefs(state)
     };
   }
 });

src/packages/__VUE/avatargroup/index.taro.vue

@@ -9,6 +9,10 @@ import { createComponent } from '../../utils/create';
 const { componentName, create } = createComponent('avatar-group');
 export default create({
   props: {
+    maxContent: {
+      type: String,
+      default: ''
+    },
     maxCount: {
       type: [Number, String],
       default: ''

src/packages/__VUE/avatargroup/index.vue

@@ -9,6 +9,10 @@ import { createComponent } from '../../utils/create';
 const { componentName, create } = createComponent('avatar-group');
 export default create({
   props: {
+    maxContent: {
+      type: String,
+      default: ''
+    },
     maxCount: {
       type: [Number, String],
       default: ''

src/packages/__VUE/category/demo.vue

@@ -19,14 +19,14 @@
 
 <script lang="ts">
 import { createComponent } from '../../utils/create';
-import { categoryInfo, categoryChild, customCategory } from './data';
 const { createDemo } = createComponent('cmt');
-import { reactive, ref, toRefs, onMounted } from 'vue';
+import { reactive, toRefs, onMounted } from 'vue';
 
 export default createDemo({
   props: {},
   setup() {
     const data = reactive({
+      categoryInfo: {},
       category: [{}],
       categoryChild: [{}],
       customCategory: [{}]
@@ -34,32 +34,30 @@ export default createDemo({
 
     onMounted(() => {
       setTimeout(() => {
-        // getData();
-        data.category = categoryInfo.category;
-        data.categoryChild = categoryChild;
-        data.customCategory = customCategory;
+        getData();
       }, 500);
     });
 
     const getData = () => {
-      fetch('//storage.360buyimg.com/nutui/3x/categoryData1.js')
+      fetch('//storage.360buyimg.com/nutui/3x/categoryData.js')
         .then((response) => response.json())
         .then((res) => {
-          // console.log('res', res)
+          console.log('res', res);
           const { categoryInfo, categoryChild, customCategory } = res;
+          data.categoryInfo = categoryInfo;
           data.category = categoryInfo.category;
           data.categoryChild = categoryChild;
           data.customCategory = customCategory;
-        }) //执行结果是 resolve就调用then方法
-        .catch((err) => console.log('Oh, error', err)); //执行结果是 reject就调用catch方法
+        })
+        .catch((err) => console.log('Oh, error', err));
     };
 
     const change = (index: any) => {
-      data.categoryChild = [].concat(categoryInfo.category[index + 1].children as any);
+      data.categoryChild = [].concat(data.categoryInfo.category[index + 1].children as any);
     };
 
     const changeText = (index: any) => {
-      data.categoryChild = [].concat(categoryInfo.category[index + 1].children as any);
+      data.categoryChild = [].concat(data.categoryInfo.category[index + 1].children as any);
     };
 
     const changeCustom = () => {

src/packages/__VUE/category/doc.md

@@ -19,79 +19,107 @@ app.use(CategoryPane);
 
 ### 经典分类模式
 
-```html
-<nutbiz-category :category="category" @change="change">
-  <nutbiz-categorypane :categoryChild="categoryChild" @onChange="onChange">
-  </nutbiz-categorypane>
-</nutbiz-category>
-```
-
-```javascript
-  // category.js 文件点击右上角‘下载数据结构’下载
-  import { categoryChild, categoryInfo } from "./category";
+:::demo
 
+```html
+<template>
+  <nut-category :category="category" @change="change">
+    <nut-categorypane :categoryChild="categoryChild" @onChange="onChange">
+    </nut-categorypane>
+  </nut-category>
+</template>
+<script lang="ts">
+import { reactive, toRefs, onMounted } from 'vue';
+
+export default {
   setup() {
     const data = reactive({
+      categoryInfo: {},
       category: [{}],
-      categoryChild: [{}],
+      categoryChild: [{}]
     });
 
     onMounted(() => {
       setTimeout(() => {
-        data.category = categoryInfo.category;
-        data.categoryChild = categoryChild;
+        getData();
       }, 500);
     });
 
+    const getData = () => {
+      fetch('//storage.360buyimg.com/nutui/3x/categoryData.js')
+        .then((response) => response.json())
+        .then((res) => {
+          const { categoryInfo, categoryChild } = res;
+          data.categoryInfo = categoryInfo;
+          data.category = categoryInfo.category;
+          data.categoryChild = categoryChild;
+        })
+        .catch((err) => console.log('Oh, error', err)); 
+    };
+
     const change = (index: any) => {
-      data.categoryChild = [].concat(
-        categoryInfo.category[index+1].children as any
-      );
+      data.categoryChild = [].concat(data.categoryInfo.category[index + 1].children as any);
     };
     const onChange =()=>{
         console.log("当前分类数据");
     }
     return {
-      onChange，
+      onChange,
       change,
       ...toRefs(data)
     }
+  }
+};
+</script>
 ```
-
+:::
 ### 只显示文字
 
-```html
-<nutbiz-category :category="category" @change="changeText">
-  <nutbiz-categorypane
-    type="text"
-    :categoryChild="categoryChild"
-    @onChange="onChange"
-  >
-  </nutbiz-categorypane
-></nutbiz-category>
-```
-
-```javascript
-  // category.js 文件点击右上角‘下载数据结构’下载
-  import { categoryChild, categoryInfo } from "./category";
+:::demo
 
+```html
+<template>
+  <nut-category :category="category" @change="changeText">
+    <nut-categorypane
+      type="text"
+      :categoryChild="categoryChild"
+      @onChange="onChange"
+    >
+    </nut-categorypane
+  ></nut-category>
+</template>
+<script lang="ts">
+import { reactive, toRefs, onMounted } from 'vue';
+
+export default {
   setup() {
     const data = reactive({
+      categoryInfo: {},
       category: [{}],
-      categoryChild: [{}],
+      categoryChild: [{}]
     });
 
     onMounted(() => {
       setTimeout(() => {
-        data.category = categoryInfo.category;
-        data.categoryChild = categoryChild;
+        getData();
       }, 500);
     });
 
+    const getData = () => {
+      fetch('//storage.360buyimg.com/nutui/3x/categoryData.js')
+        .then((response) => response.json())
+        .then((res) => {
+          console.log('res', res)
+          const { categoryInfo, categoryChild } = res;
+          data.categoryInfo = categoryInfo;
+          data.category = categoryInfo.category;
+          data.categoryChild = categoryChild;
+        })
+        .catch((err) => console.log('Oh, error', err)); 
+    };
+
     const changeText = (index: any) => {
-      data.categoryChild = [].concat(
-        categoryInfo.category[index+1].children as any
-      );
+      data.categoryChild = [].concat(data.categoryInfo.category[index + 1].children as any);
     };
 
     const onChange =()=>{
@@ -102,33 +130,48 @@ app.use(CategoryPane);
       onChange,
       ...toRefs(data)
     }
+  }
+};
+</script>
 ```
-
+:::
 ### 自定义分类
 
-```html
-<nutbiz-category @change="changeCustom"
-  ><nutbiz-categorypane
-    type="custom"
-    :customCategory="customCategory"
-    @onChange="changeCustom"
-  >
-  </nutbiz-categorypane
-></nutbiz-category>
-```
+:::demo
 
-```javascript
-  // category.js 文件点击右上角‘下载数据结构’下载
-  import { categoryChild, categoryInfo } from "./category";
+```html
+<template>
+  <nut-category @change="changeCustom"
+    ><nut-categorypane
+      type="custom"
+      :customCategory="customCategory"
+      @onChange="changeCustom"
+    >
+    </nut-categorypane
+  ></nut-category>
+</template>
+<script lang="ts">
+import { reactive, toRefs, onMounted } from 'vue';
+
+export default {
   setup() {
     const data = reactive({
        customCategory: [{}],
     });
     onMounted(() => {
       setTimeout(() => {
-         data.customCategory = customCategory;
+         getData();
       }, 500);
     });
+    const getData = () => {
+      fetch('//storage.360buyimg.com/nutui/3x/categoryData.js')
+        .then((response) => response.json())
+        .then((res) => {
+          const { customCategory } = res;
+          data.customCategory = customCategory;
+        })
+        .catch((err) => console.log('Oh, error', err)); 
+    };
     const changeCustom = () => {
       console.log('点击分类数据')
     };
@@ -136,8 +179,11 @@ app.use(CategoryPane);
       changeCustom,
       ...toRefs(data)
     }
+  }
+};
+</script>
 ```
-
+:::
 ## API
 
 ### Category Props

src/packages/__VUE/input/index.taro.vue

@@ -327,17 +327,10 @@ export default create({
       return props.modelValue;
     });
 
-    // const inputmode = computed(() => {
-    //   return props.type === 'digit' ? 'decimal' : props.type === 'number' ? 'numeric' : 'text';
-    // });
-
     const onInput = (event: Event) => {
       const input = event.target as HTMLInputElement;
       let value = input.value;
 
-      // if (!event.target!.composing) {
-      //   updateValue((event.target as HTMLInputElement).value);
-      // }
       updateValue(value);
     };
 
@@ -357,14 +350,6 @@ export default create({
         value = props.formatter(value);
       }
 
-      // if (props.maxLength && value.length > Number(props.maxLength)) {
-      //   value = value.slice(0, Number(props.maxLength));
-      // }
-
-      if (inputRef.value && inputRef.value.value !== value) {
-        inputRef.value.value = value;
-      }
-
       if (value !== props.modelValue) {
         emit('update:modelValue', value);
         emit('change', value);
@@ -376,9 +361,6 @@ export default create({
       let value = input.value;
       active.value = true;
       emit('focus', value, event);
-      // if (getProp('readonly')) {
-      //   blur();
-      // }
     };
 
     const onBlur = (event: Event) => {
@@ -386,10 +368,6 @@ export default create({
         active.value = false;
       }, 200);
 
-      // if (getProp('readonly')) {
-      //   return;
-      // }
-
       const input = event.target as HTMLInputElement;
       let value = input.value;
       if (props.maxLength && value.length > Number(props.maxLength)) {

src/packages/__VUE/input/index.vue

@@ -325,17 +325,10 @@ export default create({
       return props.modelValue;
     });
 
-    // const inputmode = computed(() => {
-    //   return props.type === 'digit' ? 'decimal' : props.type === 'number' ? 'numeric' : 'text';
-    // });
-
     const onInput = (event: Event) => {
       const input = event.target as HTMLInputElement;
       let value = input.value;
 
-      // if (!event.target!.composing) {
-      //   updateValue((event.target as HTMLInputElement).value);
-      // }
       updateValue(value);
     };
 
@@ -355,14 +348,10 @@ export default create({
         value = props.formatter(value);
       }
 
-      // if (props.maxLength && value.length > Number(props.maxLength)) {
-      //   value = value.slice(0, Number(props.maxLength));
+      // if (inputRef.value && inputRef.value.value !== value) {
+      //   inputRef.value.value = value;
       // }
 
-      if (inputRef.value && inputRef.value.value !== value) {
-        inputRef.value.value = value;
-      }
-
       if (value !== props.modelValue) {
         emit('update:modelValue', value);
         emit('change', value);
@@ -384,10 +373,6 @@ export default create({
         active.value = false;
       }, 200);
 
-      // if (getProp('readonly')) {
-      //   return;
-      // }
-
       const input = event.target as HTMLInputElement;
       let value = input.value;
       if (props.maxLength && value.length > Number(props.maxLength)) {

src/sites/mobile-taro/vue/src/exhibition/pages/avatar/index.vue

@@ -68,15 +68,11 @@
         <nut-avatar icon="my"></nut-avatar>
         <nut-avatar color="rgb(245, 106, 0)" bg-color="rgb(253, 227, 207)">U</nut-avatar>
         <nut-avatar icon="my"></nut-avatar>
-
-        <nut-avatar icon="my">
-          <template #maxContent>+2</template>
-        </nut-avatar>
       </nut-avatar-group>
     </nut-cell>
     <h2>组合头像可控制层级方向</h2>
     <nut-cell>
-      <nut-avatar-group max-count="3" zIndex="right">
+      <nut-avatar-group max-count="3" zIndex="right" max-content="...">
         <nut-avatar
           url="https://img12.360buyimg.com/imagetools/jfs/t1/196430/38/8105/14329/60c806a4Ed506298a/e6de9fb7b8490f38.png"
         >
@@ -84,10 +80,6 @@
         <nut-avatar icon="my"></nut-avatar>
         <nut-avatar color="rgb(245, 106, 0)" bg-color="rgb(253, 227, 207)">U</nut-avatar>
         <nut-avatar icon="my"></nut-avatar>
-
-        <nut-avatar icon="my">
-          <template #maxContent>...</template>
-        </nut-avatar>
       </nut-avatar-group>
     </nut-cell>