fix(configprovider): 全局修改自定义icon方法变更 (#2173)

* fix: qq小程序tabs修复样式

* fix: 全局组件和icon组件优化

src/packages/__VUE/configprovider/common.ts

@@ -1,6 +1,4 @@
-import { isObject } from '@/packages/utils/util';
-import { h, PropType, VNode } from 'vue';
-
+import { h, PropType, provide } from 'vue';
 export const component = {
   props: {
     theme: { type: String, default: '' },
@@ -9,48 +7,14 @@ export const component = {
     fontClassName: { type: String, default: 'nutui-iconfont' }
   },
   setup(props: any, { slots }: any) {
-    // 覆盖默认插槽的属性
-    const overDefaultSlotProp = (vnodes: VNode[]) => {
-      if (!vnodes) {
-        return;
-      }
-      vnodes.forEach((vnode: VNode) => {
-        let type = vnode.type;
-        type = (type as any).name || type;
-        if (!vnode.props) {
-          vnode.props = {};
-        }
-        if (type == 'nut-icon') {
-          vnode.props['fontClassName'] = vnode.props['font-class-name'] || props.fontClassName;
-          vnode.props['classPrefix'] = vnode.props['class-prefix'] || props.classPrefix;
-        }
-
-        if (Array.isArray(vnode.children) && vnode.children?.length) {
-          overDefaultSlotProp(vnode.children as VNode[]);
-        } else if (isObject(vnode.children) && Object.keys(vnode.children)) {
-          let children = vnode.children as any;
-          for (const key in children) {
-            if (key === '_') {
-              break;
-            }
-
-            const childrenVNode = children[key]?.();
-            overDefaultSlotProp(childrenVNode);
-            children[key] = () => childrenVNode;
-          }
-        }
-      });
-    };
-
+    provide('nut-config-provider', props);
     return () => {
-      const defaultSlots = slots.default?.();
-      overDefaultSlotProp(defaultSlots);
       return h(
         props.tag,
         {
-          class: `nut-theme-${props.theme}`
+          class: `nut-config-provider nut-theme-${props.theme}`
         },
-        defaultSlots
+        slots.default?.()
       );
     };
   }

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

@@ -1,5 +1,5 @@
 <script lang="ts">
-import { h, PropType } from 'vue';
+import { computed, h, inject, PropType } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create } = createComponent('icon');
 import { pxCheck } from '@/packages/utils/pxCheck';
@@ -8,14 +8,15 @@ export default create({
   props: {
     name: { type: String, default: '' },
     size: { type: [String, Number], default: '' },
-    classPrefix: { type: String, default: 'nut-icon' },
-    fontClassName: { type: String, default: 'nutui-iconfont' },
+    classPrefix: { type: String, default: '' },
+    fontClassName: { type: String, default: '' },
     color: { type: String, default: '' },
     tag: { type: String as PropType<keyof HTMLElementTagNameMap>, default: 'i' }
   },
   emits: ['click'],
 
   setup(props, { emit, slots }) {
+    const config: any = inject('nut-config-provider', null);
     const handleClick = (event: Event) => {
       emit('click', event);
     };
@@ -23,6 +24,8 @@ export default create({
     const isImage = () => {
       return props.name ? props.name.indexOf('/') !== -1 : false;
     };
+    const classPrefix = computed(() => props.classPrefix || config?.classPrefix || 'nut-icon');
+    const fontClassName = computed(() => props.fontClassName || config?.fontClassName || 'nutui-iconfont');
 
     return () => {
       const _isImage = isImage();
@@ -31,7 +34,7 @@ export default create({
         {
           class: _isImage
             ? `${componentName}__img`
-            : `${props.fontClassName} ${componentName} ${props.classPrefix}-${props.name}`,
+            : `${fontClassName.value} ${componentName} ${classPrefix.value}-${props.name}`,
           style: {
             color: props.color,
             fontSize: pxCheck(props.size),

src/packages/__VUE/icon/index.vue

@@ -1,5 +1,5 @@
 <script lang="ts">
-import { h, PropType, ref } from 'vue';
+import { h, PropType, inject, computed } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create } = createComponent('icon');
 import { pxCheck } from '@/packages/utils/pxCheck';
@@ -8,21 +8,23 @@ export default create({
   props: {
     name: { type: String, default: '' },
     size: { type: [String, Number], default: '' },
-    classPrefix: { type: String, default: 'nut-icon' },
-    fontClassName: { type: String, default: 'nutui-iconfont' },
+    classPrefix: { type: String, default: '' },
+    fontClassName: { type: String, default: '' },
     color: { type: String, default: '' },
     tag: { type: String as PropType<keyof HTMLElementTagNameMap>, default: 'i' }
   },
   emits: ['click'],
 
   setup(props, { emit, slots }) {
+    const config: any = inject('nut-config-provider', null);
     const handleClick = (event: Event) => {
       emit('click', event);
     };
-
     const isImage = () => {
       return props.name ? props.name.indexOf('/') !== -1 : false;
     };
+    const classPrefix = computed(() => props.classPrefix || config?.classPrefix || 'nut-icon');
+    const fontClassName = computed(() => props.fontClassName || config?.fontClassName || 'nutui-iconfont');
 
     return () => {
       const _isImage = isImage();
@@ -31,7 +33,7 @@ export default create({
         {
           class: _isImage
             ? `${componentName}__img`
-            : `${props.fontClassName} ${componentName} ${props.classPrefix}-${props.name}`,
+            : `${fontClassName.value} ${componentName} ${classPrefix.value}-${props.name}`,
           style: {
             color: props.color,
             fontSize: pxCheck(props.size),