Merge branch 'v4' of https://github.com/jdf2e/nutui into v4

src/config.json

@@ -722,7 +722,7 @@
         },
         {
           "version": "3.0.0",
-          "name": "BackTop",
+          "name": "Backtop",
           "taro": true,
           "tarodoc": true,
           "sort": "1",

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

@@ -96,7 +96,7 @@ export default create({
   emits: ['delIcon', 'editIcon', 'itemClick', 'longCopy', 'longSet', 'longDel', 'swipeDel', 'add'],
 
   setup(props, { emit }) {
-    const dataArray = ref([]);
+    const dataArray = ref([]) as any;
     const dataInfo = reactive({
       id: 2,
       addressName: '姓名',

src/packages/__VUE/addresslist/index.vue

@@ -96,7 +96,7 @@ export default create({
   emits: ['delIcon', 'editIcon', 'itemClick', 'longCopy', 'longSet', 'longDel', 'swipeDel', 'add'],
 
   setup(props, { emit }) {
-    const dataArray = ref([]);
+    const dataArray = ref([]) as any;
     const dataInfo = reactive({
       id: 2,
       addressName: '姓名',

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

@@ -30,7 +30,7 @@
   </view>
 </template>
 <script lang="ts">
-import { toRefs, onMounted, computed, inject, reactive, ref } from 'vue';
+import { toRefs, onMounted, computed, inject, reactive, ref, Ref } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create } = createComponent('avatar');
 export default create({
@@ -69,7 +69,7 @@ export default create({
     const { size, shape, bgColor, color, icon } = toRefs(props);
     const sizeValue = ['large', 'normal', 'small'];
     const avatarGroup: any = inject('avatarGroup', null);
-    const avatarRef = ref(null);
+    const avatarRef = ref(null) as Ref;
     const visible = reactive({
       lightTheme: false
     });
@@ -82,7 +82,6 @@ export default create({
     onMounted(() => {
       const children = avatarGroup?.avatarGroupRef?.value?.children;
       if (children) {
-        // console.log('parent', avatarGroup);
         avatarLength(children);
       }
     });
@@ -115,7 +114,7 @@ export default create({
     });
 
     const iconStyles = computed(() => {
-      return !!icon.value ? icon.value : '';
+      return icon?.value ? icon.value : '';
     });
 
     const isShowText = computed(() => {
@@ -136,12 +135,12 @@ export default create({
       }
     };
 
-    const activeAvatar = (event: any) => {
+    const activeAvatar = (event: MouseEvent) => {
       emit('active-avatar', event);
     };
 
-    const onError = (event: any) => {
-      emit('onError', event);
+    const onError = () => {
+      emit('onError');
     };
 
     return {

src/packages/__VUE/avatar/index.vue

@@ -30,7 +30,7 @@
   </view>
 </template>
 <script lang="ts">
-import { toRefs, onMounted, computed, inject, reactive, ref } from 'vue';
+import { toRefs, onMounted, computed, inject, reactive, ref, Ref } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create } = createComponent('avatar');
 export default create({
@@ -69,7 +69,7 @@ export default create({
     const { size, shape, bgColor, color, icon } = toRefs(props);
     const sizeValue = ['large', 'normal', 'small'];
     const avatarGroup: any = inject('avatarGroup', null);
-    const avatarRef = ref(null);
+    const avatarRef = ref(null) as Ref;
     const visible = reactive({
       lightTheme: false
     });
@@ -82,7 +82,6 @@ export default create({
     onMounted(() => {
       const children = avatarGroup?.avatarGroupRef?.value?.children;
       if (children) {
-        // console.log('children', children);
         avatarLength(children);
       }
     });
@@ -115,7 +114,7 @@ export default create({
     });
 
     const iconStyles = computed(() => {
-      return !!icon.value ? icon.value : '';
+      return icon?.value ? icon.value : '';
     });
 
     const isShowText = computed(() => {
@@ -141,8 +140,8 @@ export default create({
       emit('active-avatar', event);
     };
 
-    const onError = (event: MouseEvent) => {
-      emit('onError', event);
+    const onError = () => {
+      emit('onError');
     };
 
     return {

src/packages/__VUE/backtop/__tests__/backtop.spec.ts

@@ -1,5 +1,5 @@
 import { mount, config } from '@vue/test-utils';
-import BackTop from '../index.vue';
+import Backtop from '../index.vue';
 import { mockScrollTop } from './../../../utils/unit';
 
 import NutIcon from '../../icon/index.vue';
@@ -16,19 +16,19 @@ afterAll(() => {
 });
 
 test('emit click event', () => {
-  const wrapper = mount(BackTop);
+  const wrapper = mount(Backtop);
   wrapper.trigger('click');
   expect(wrapper.emitted('click')!.length).toEqual(1);
 });
 
 test('backtop show', () => {
-  const wrapper = mount(BackTop);
+  const wrapper = mount(Backtop);
   const backtop = wrapper.find('.nut-backtop');
   expect(backtop.exists()).toBe(true);
 });
 
 test('backtop style', () => {
-  const wrapper = mount(BackTop, {
+  const wrapper = mount(Backtop, {
     props: {
       bottom: 50
     }
@@ -38,7 +38,7 @@ test('backtop style', () => {
 });
 
 test('backtop style,backtop show', async () => {
-  const wrapper = mount(BackTop, {
+  const wrapper = mount(Backtop, {
     props: {
       right: 40
     }
@@ -51,7 +51,7 @@ test('backtop style,backtop show', async () => {
 });
 
 test('backtop style', async () => {
-  const wrapper = mount(BackTop, {
+  const wrapper = mount(Backtop, {
     props: {
       zIndex: 100,
       distance: 0

src/packages/__VUE/backtop/doc.en-US.md

@@ -1,4 +1,4 @@
-# BackTop
+# Backtop
 
 ### Intro
 
@@ -9,10 +9,10 @@ Provides a quick return to the top function for long pages.
 ```javascript
 
 import { createApp } from 'vue';
-import { BackTop,Icon } from '@nutui/nutui';
+import { Backtop,Icon } from '@nutui/nutui';
 
 const app = createApp();
-app.use(BackTop);
+app.use(Backtop);
 app.use(Icon);
 
 ```

src/packages/__VUE/backtop/doc.md

@@ -1,4 +1,4 @@
-# BackTop 返回顶部
+# Backtop 返回顶部
 
 ### 介绍
 
@@ -9,10 +9,10 @@
 ```javascript
 
 import { createApp } from 'vue';
-import { BackTop,Icon } from '@nutui/nutui';
+import { Backtop,Icon } from '@nutui/nutui';
 
 const app = createApp();
-app.use(BackTop);
+app.use(Backtop);
 app.use(Icon);
 
 ```

src/packages/__VUE/backtop/doc.taro.md

@@ -1,4 +1,4 @@
-# BackTop 返回顶部
+# Backtop 返回顶部
 
 ### 介绍
 
@@ -9,10 +9,10 @@
 ```javascript
 
 import { createApp } from 'vue';
-import { BackTop,Icon } from '@nutui/nutui-taro';
+import { Backtop,Icon } from '@nutui/nutui-taro';
 
 const app = createApp();
-app.use(BackTop);
+app.use(Backtop);
 app.use(Icon);
 
 ```

src/packages/__VUE/category/demo.vue

@@ -2,16 +2,16 @@
   <div class="demo">
     <h2>{{ translate('title1') }}</h2>
     <nut-category :category="category" @change="change">
-      <nut-categorypane :categoryChild="categoryChild" @onChange="onChange"> </nut-categorypane>
+      <nut-category-pane :categoryChild="categoryChild" @onChange="onChange"> </nut-category-pane>
     </nut-category>
     <h2>{{ translate('title2') }}</h2>
     <nut-category :category="category" @change="changeText">
-      <nut-categorypane type="text" :categoryChild="categoryChild" @onChange="onChange"> </nut-categorypane
+      <nut-category-pane type="text" :categoryChild="categoryChild" @onChange="onChange"> </nut-category-pane
     ></nut-category>
 
     <h2>{{ translate('title3') }}</h2>
     <nut-category
-      ><nut-categorypane type="custom" :customCategory="customCategory" @onChange="changeCustom"> </nut-categorypane
+      ><nut-category-pane type="custom" :customCategory="customCategory" @onChange="changeCustom"> </nut-category-pane
     ></nut-category>
   </div>
 </template>

src/packages/__VUE/category/doc.en-US.md

@@ -22,8 +22,8 @@ app.use(CategoryPane);
 ```html
 <template>
   <nut-category :category="category" @change="change">
-    <nut-categorypane :categoryChild="categoryChild" @onChange="onChange">
-    </nut-categorypane>
+    <nut-category-pane :categoryChild="categoryChild" @onChange="onChange">
+    </nut-category-pane>
   </nut-category>
 </template>
 <script lang="ts">
@@ -78,12 +78,12 @@ export default {
 ```html
 <template>
   <nut-category :category="category" @change="changeText">
-    <nut-categorypane
+    <nut-category-pane
       type="text"
       :categoryChild="categoryChild"
       @onChange="onChange"
     >
-    </nut-categorypane
+    </nut-category-pane
   ></nut-category>
 </template>
 <script lang="ts">
@@ -140,12 +140,12 @@ export default {
 ```html
 <template>
   <nut-category @change="changeCustom"
-    ><nut-categorypane
+    ><nut-category-pane
       type="custom"
       :customCategory="customCategory"
       @onChange="changeCustom"
     >
-    </nut-categorypane
+    </nut-category-pane
   ></nut-category>
 </template>
 <script lang="ts">

src/packages/__VUE/category/doc.md

@@ -22,8 +22,8 @@ app.use(CategoryPane);
 ```html
 <template>
   <nut-category :category="category" @change="change">
-    <nut-categorypane :categoryChild="categoryChild" @onChange="onChange">
-    </nut-categorypane>
+    <nut-category-pane :categoryChild="categoryChild" @onChange="onChange">
+    </nut-category-pane>
   </nut-category>
 </template>
 <script lang="ts">
@@ -78,12 +78,12 @@ export default {
 ```html
 <template>
   <nut-category :category="category" @change="changeText">
-    <nut-categorypane
+    <nut-category-pane
       type="text"
       :categoryChild="categoryChild"
       @onChange="onChange"
     >
-    </nut-categorypane
+    </nut-category-pane
   ></nut-category>
 </template>
 <script lang="ts">
@@ -140,12 +140,12 @@ export default {
 ```html
 <template>
   <nut-category @change="changeCustom"
-    ><nut-categorypane
+    ><nut-category-pane
       type="custom"
       :customCategory="customCategory"
       @onChange="changeCustom"
     >
-    </nut-categorypane
+    </nut-category-pane
   ></nut-category>
 </template>
 <script lang="ts">

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

@@ -17,15 +17,15 @@
   </div>
 </template>
 <script lang="ts">
-import { Ref, ref, toRefs, warn, watch, onMounted } from 'vue';
+import { PropType, ref } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create } = createComponent('category');
 
-//经典分类
-//商品池
-//自定义
+export type CategoryType = {
+  catName?: string;
+  [key: string]: any;
+};
 
-interface props {}
 export default create({
   props: {
     //分类模式
@@ -36,7 +36,7 @@ export default create({
 
     //左侧导航栏
     category: {
-      type: Array,
+      type: Array as PropType<CategoryType>,
       default: () => []
     }
   },
@@ -50,8 +50,6 @@ export default create({
       emit('change', index);
     };
 
-    onMounted(() => {});
-
     return {
       getChildList,
       checkIndex,

src/packages/__VUE/category/index.vue

@@ -7,7 +7,7 @@
             :class="[checkIndex == index ? 'nut-category__cateListItemChecked' : 'nut-category__cateListItem']"
             @click="getChildList(index)"
           >
-            {{ item?.catName }}
+            {{ item.catName }}
           </div>
         </div>
       </div>
@@ -17,15 +17,15 @@
   </div>
 </template>
 <script lang="ts">
-import { Ref, ref, toRefs, warn, watch, onMounted } from 'vue';
+import { PropType, ref } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create } = createComponent('category');
 
-//经典分类
-//商品池
-//自定义
+export type CategoryType = {
+  catName?: string;
+  [key: string]: any;
+};
 
-interface props {}
 export default create({
   props: {
     //分类模式
@@ -33,11 +33,10 @@ export default create({
       type: String,
       default: 'classify'
     },
-
     //左侧导航栏
     category: {
-      type: Array,
-      default: () => []
+      type: Array as PropType<CategoryType>,
+      default: []
     }
   },
 
@@ -50,8 +49,6 @@ export default create({
       emit('change', index);
     };
 
-    onMounted(() => {});
-
     return {
       getChildList,
       checkIndex,

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

@@ -39,22 +39,27 @@
     <!-- 自定义 -->
 
     <div v-if="type == 'custom'" class="nut-categorypane__selfItemList">
-      <div v-for="(sku, key) in customCategory" class="nut-categorypane__skuName" :key="key" @click="onChange()">
+      <div v-for="(sku, key) in customCategory" class="nut-categorypane__skuName" :key="key" @click="onChange(sku)">
         {{ sku?.catName }}
       </div>
     </div>
   </div>
 </template>
 <script lang="ts">
-import { Ref, ref, toRefs, warn, watch, onMounted } from 'vue';
+import { PropType } from 'vue';
 import { createComponent } from '@/packages/utils/create';
-const { componentName, create } = createComponent('categorypane');
+const { componentName, create } = createComponent('category-pane');
 
-//经典分类
-//商品池
-//自定义
+export type ChildType = {
+  catName?: string;
+  catType?: number;
+  [key: string]: any;
+};
+export type CustomType = {
+  catName?: string;
+  [key: string]: any;
+};
 
-interface props {}
 export default create({
   props: {
     //分类模式
@@ -65,19 +70,19 @@ export default create({
 
     //右侧导航数据
     categoryChild: {
-      type: Array,
+      type: Array as PropType<ChildType>,
       default: () => []
     },
 
     //模式传入自定义数据
     customCategory: {
-      type: Array,
+      type: Array as PropType<CustomType>,
       default: () => []
     }
   },
 
   setup(props, { emit }) {
-    const onChange = (sku: any) => {
+    const onChange = (sku: string) => {
       emit('onChange', sku);
     };
 

src/packages/__VUE/categorypane/index.vue

@@ -46,15 +46,20 @@
   </div>
 </template>
 <script lang="ts">
-import { Ref, ref, toRefs, warn, watch, onMounted } from 'vue';
+import { PropType } from 'vue';
 import { createComponent } from '@/packages/utils/create';
-const { componentName, create } = createComponent('categorypane');
+const { componentName, create } = createComponent('category-pane');
 
-//经典分类
-//商品池
-//自定义
+export type ChildType = {
+  catName?: string;
+  catType?: number;
+  [key: string]: any;
+};
+export type CustomType = {
+  catName?: string;
+  [key: string]: any;
+};
 
-interface props {}
 export default create({
   props: {
     //分类模式
@@ -65,19 +70,19 @@ export default create({
 
     //右侧导航数据
     categoryChild: {
-      type: Array,
+      type: Array as PropType<ChildType>,
       default: () => []
     },
 
     //模式传入自定义数据
     customCategory: {
-      type: Array,
+      type: Array as PropType<CustomType>,
       default: () => []
     }
   },
 
   setup(props, { emit }) {
-    const onChange = (sku: any) => {
+    const onChange = (sku: string) => {
       emit('onChange', sku);
     };
 

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

@@ -36,7 +36,7 @@
 </template>
 
 <script lang="ts">
-import { onMounted, computed, toRefs, ref } from 'vue';
+import { onMounted, computed, toRefs, ref, ComputedRef } from 'vue';
 import { useTaroRect } from '@/packages/utils/useTaroRect';
 import { createComponent } from '@/packages/utils/create';
 import Taro from '@tarojs/taro';
@@ -84,7 +84,7 @@ export default create({
       };
     });
 
-    const styles = computed(() => {
+    const styles: ComputedRef = computed(() => {
       return {
         zIndex: zIndex.value
       };

src/packages/__VUE/navbar/index.vue

@@ -36,7 +36,7 @@
 </template>
 
 <script lang="ts">
-import { onMounted, computed, toRefs, ref, nextTick } from 'vue';
+import { onMounted, computed, toRefs, ref, nextTick, ComputedRef, Ref } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create } = createComponent('navbar');
 export default create({
@@ -71,9 +71,9 @@ export default create({
   emits: ['on-click-back', 'on-click-title', 'on-click-icon', 'on-click-right'],
   setup(props, { emit }) {
     const { border, fixed, safeAreaInsetTop, placeholder, zIndex } = toRefs(props);
-    const navBarWrap = ref(null);
-    const navBarHtml = ref(null);
-    let navHeight = ref(0);
+    const navBarWrap = ref(null) as Ref;
+    const navBarHtml = ref<HTMLElement | null>(null);
+    let navHeight = ref();
     const classes = computed(() => {
       const prefixCls = componentName;
       return {
@@ -84,7 +84,7 @@ export default create({
       };
     });
 
-    const styles = computed(() => {
+    const styles: ComputedRef = computed(() => {
       return {
         zIndex: zIndex.value
       };
@@ -93,8 +93,8 @@ export default create({
     onMounted(() => {
       if (fixed.value && placeholder.value) {
         nextTick(() => {
-          navHeight = navBarHtml?.value?.getBoundingClientRect().height;
-          navBarWrap.value.style.height = navHeight + 'px';
+          navHeight.value = navBarHtml?.value?.getBoundingClientRect().height;
+          navBarWrap.value.style.height = navHeight.value + 'px';
         });
       }
     });

src/packages/__VUE/price/demo.vue

@@ -13,7 +13,7 @@
     </nut-cell-group>
     <h2>{{ translate('title2') }}</h2>
     <nut-cell>
-      <nut-price :price="8888" decimal-digits="0" size="normal" :need-symbol="true" :thousands="true" />
+      <nut-price :price="8888" :decimal-digits="0" size="normal" :need-symbol="true" :thousands="true" />
     </nut-cell>
     <h2>{{ translate('title3') }}</h2>
     <nut-cell>

src/packages/__VUE/price/doc.en-US.md

@@ -39,7 +39,7 @@ app.use(Price);
 
 ``` html
 <template>
-    <nut-price :price="8888" decimal-digits="0" size="normal" :need-symbol="true" :thousands="true" />
+    <nut-price :price="8888" :decimal-digits="0" size="normal" :need-symbol="true" :thousands="true" />
 </template>
 ```
 
@@ -113,7 +113,7 @@ app.use(Price);
 | price          | Price                                                      | Number ｜ String | 0       |
 | need-symbol    | Add symbol                                                 | Boolean          | true   |
 | symbol         | Symbol type                                                | String           | &yen;  |
-| decimal-digits | Decimal digits                                             | Number ｜ String | 2      |
+| decimal-digits | Decimal digits                                             | Number | 2      |
 | thousands      | Thousands separation                                       | Boolean          | false  |
 | position       | The symbol appear before or after the price，`before`、`after` | String           | before |
 | size           | Size，`large`、`normal`、`small`                            | String           | large |

src/packages/__VUE/price/doc.md

@@ -39,7 +39,7 @@ app.use(Price);
 
 ``` html
 <template>
-    <nut-price :price="8888" decimal-digits="0" size="normal" :need-symbol="true" :thousands="true" />
+    <nut-price :price="8888" :decimal-digits="0" size="normal" :need-symbol="true" :thousands="true" />
 </template>
 ```
 
@@ -113,7 +113,7 @@ app.use(Price);
 | price          | 价格数量                                | Number ｜ String | 0      |
 | need-symbol    | 是否需要加上 symbol 符号                 | Boolean          | true   |
 | symbol         | 符号类型                                | String           | &yen;  |
-| decimal-digits | 小数位位数                              | Number ｜ String  | 2     |
+| decimal-digits | 小数位位数                              | Number  | 2     |
 | thousands      | 是否按照千分号形式显示                    | Boolean          | false  |
 | position       | 符号显示在价格前或者后，`before`、`after`  | String           | before |
 | size           | 价格尺寸，`large`、`normal`、`small`     | String           | large |

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

@@ -40,7 +40,7 @@ export default create({
       default: '¥'
     },
     decimalDigits: {
-      type: [Number, String],
+      type: Number,
       default: 2
     },
     thousands: {

src/packages/__VUE/price/index.vue

@@ -42,7 +42,7 @@ export default create({
       default: '¥'
     },
     decimalDigits: {
-      type: [Number, String],
+      type: Number,
       default: 2
     },
     thousands: {

src/sites/mobile-taro/vue/src/business/pages/category/index.vue

@@ -2,17 +2,17 @@
   <div class="demo full">
     <h2>经典分类模式</h2>
     <nut-category :category="category" @change="change">
-      <nut-categorypane :categoryChild="categoryChild" @onChange="onChange"> </nut-categorypane>
+      <nut-category-pane :categoryChild="categoryChild" @onChange="onChange"> </nut-category-pane>
     </nut-category>
 
     <h2>只显示文字</h2>
     <nut-category :category="category" @change="changeText">
-      <nut-categorypane type="text" :categoryChild="categoryChild" @onChange="onChange"> </nut-categorypane
+      <nut-category-pane type="text" :categoryChild="categoryChild" @onChange="onChange"> </nut-category-pane
     ></nut-category>
 
     <h2>自定义</h2>
     <nut-category
-      ><nut-categorypane type="custom" :customCategory="customCategory" @onChange="changeCustom"> </nut-categorypane
+      ><nut-category-pane type="custom" :customCategory="customCategory" @onChange="changeCustom"> </nut-category-pane
     ></nut-category>
   </div>
 </template>

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

@@ -13,7 +13,7 @@
     </nut-cell-group>
     <h2>不保留小数</h2>
     <nut-cell>
-      <nut-price :price="8888" decimal-digits="0" size="normal" :need-symbol="true" :thousands="true" />
+      <nut-price :price="8888" :decimal-digits="0" size="normal" :need-symbol="true" :thousands="true" />
     </nut-cell>
     <h2>调整 symbol 符号位置</h2>
     <nut-cell>