fix: inject value maybe undefined && tag style invalid (#6320)

* fix: inject value maybe undefined

* fix(tag): style invalid

Author: zkwolf

components/cascader/index.tsx

@@ -323,7 +323,7 @@ const Cascader = defineComponent({
               getTransitionDirection(placement.value),
               transitionName,
             )}
-            getPopupContainer={getPopupContainer.value}
+            getPopupContainer={getPopupContainer?.value}
             customSlots={{
               ...slots,
               checkable: () => <span class={`${cascaderPrefixCls.value}-checkbox-inner`} />,

components/drawer/index.tsx

@@ -148,7 +148,7 @@ const Drawer = defineComponent({
     const [wrapSSR, hashId] = useStyle(prefixCls);
     const getContainer = computed(() =>
       // 有可能为 false，所以不能直接判断
-      props.getContainer === undefined && getPopupContainer.value
+      props.getContainer === undefined && getPopupContainer?.value
         ? () => getPopupContainer.value(document.body)
         : props.getContainer,
     );

components/image/index.tsx

@@ -43,7 +43,7 @@ const Image = defineComponent<ImageProps>({
     });
 
     return () => {
-      const imageLocale = configProvider.locale.value?.Image || defaultLocale.Image;
+      const imageLocale = configProvider.locale?.value?.Image || defaultLocale.Image;
       const defaultPreviewMask = () => (
         <div class={`${prefixCls.value}-mask-info`}>
           <EyeOutlined />

components/page-header/index.tsx

@@ -56,7 +56,7 @@ const PageHeader = defineComponent({
         compact.value = width < 768;
       }
     };
-    const ghost = computed(() => props.ghost ?? pageHeader.value?.ghost ?? true);
+    const ghost = computed(() => props.ghost ?? pageHeader?.value?.ghost ?? true);
 
     const getBackIcon = () => {
       return (

components/select/index.tsx

@@ -266,7 +266,7 @@ const Select = defineComponent({
           dropdownMatchSelectWidth={dropdownMatchSelectWidth}
           {...selectProps}
           {...attrs}
-          showSearch={props.showSearch ?? select.value?.showSearch}
+          showSearch={props.showSearch ?? select?.value?.showSearch}
           placeholder={placeholder}
           listHeight={listHeight}
           listItemHeight={listItemHeight}
@@ -279,7 +279,7 @@ const Select = defineComponent({
           clearIcon={clearIcon}
           notFoundContent={mergedNotFound}
           class={[mergedClassName.value, attrs.class]}
-          getPopupContainer={getPopupContainer.value}
+          getPopupContainer={getPopupContainer?.value}
           dropdownClassName={rcSelectRtlDropdownClassName}
           onChange={triggerChange}
           onBlur={handleBlur}

components/tag/index.tsx

@@ -1,4 +1,4 @@
-import type { HTMLAttributes, App, PropType, ExtractPropTypes, Plugin } from 'vue';
+import type { HTMLAttributes, App, PropType, ExtractPropTypes, Plugin, CSSProperties } from 'vue';
 import { ref, defineComponent, watchEffect, computed } from 'vue';
 import classNames from '../_util/classNames';
 import PropTypes from '../_util/vue-types';
@@ -133,7 +133,11 @@ const Tag = defineComponent({
       const isNeedWave = 'onClick' in attrs;
 
       const tagNode = (
-        <span {...attrs} class={tagClassName.value} style={tagStyle}>
+        <span
+          {...attrs}
+          class={tagClassName.value}
+          style={[tagStyle, attrs.style as CSSProperties]}
+        >
           {kids}
           {renderCloseIcon()}
         </span>

components/tree-select/index.tsx

@@ -314,7 +314,7 @@ const TreeSelect = defineComponent({
             }
             showTreeIcon={treeIcon as any}
             notFoundContent={mergedNotFound}
-            getPopupContainer={getPopupContainer.value}
+            getPopupContainer={getPopupContainer?.value}
             treeMotion={null}
             dropdownClassName={mergedDropdownClassName.value}
             choiceTransitionName={choiceTransitionName.value}