fix(n-result): show icons on re-render after hydration (#5686)

* fix(n-result): show icons on re-render after hydration * refactor: change iconMap name --------- Co-authored-by: 07akioni <07akioni2@gmail.com>
tusen-ai · Feb 23, 2024 · 53ebcbe · 53ebcbe
1 parent b6c4be7
commit 53ebcbe
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 10 deletions.
diff --git a/CHANGELOG.en-US.md b/CHANGELOG.en-US.md
@@ -5,6 +5,7 @@
 ### Fixes
 
 - Fix `n-split`'s `min` attribute does not take effect
+- Fix `n-result` built-in icons not re-rendered after hydration.
 
 ### Features
 

diff --git a/CHANGELOG.zh-CN.md b/CHANGELOG.zh-CN.md
@@ -5,6 +5,7 @@
 ### Fixes
 
 - 修复 `n-split` 的 `min` 属性未生效
+- Fix `n-result` built-in icons not re-rendered after hydration.
 
 ### Features
 

diff --git a/src/result/src/Result.tsx b/src/result/src/Result.tsx
@@ -24,15 +24,15 @@ import image418 from './418'
 import image403 from './403'
 import style from './styles/index.cssr'
 
-const iconMap = {
-  403: image403,
-  404: image404,
-  418: image418,
-  500: image500,
-  info: <InfoIcon />,
-  success: <SuccessIcon />,
-  warning: <WarningIcon />,
-  error: <ErrorIcon />
+const iconRenderMap = {
+  403: () => image403,
+  404: () => image404,
+  418: () => image418,
+  500: () => image500,
+  info: () => <InfoIcon />,
+  success: () => <SuccessIcon />,
+  warning: () => <WarningIcon />,
+  error: () => <ErrorIcon />
 }
 
 export const resultProps = {
@@ -130,7 +130,7 @@ export default defineComponent({
         <div class={`${mergedClsPrefix}-result-icon`}>
           {$slots.icon?.() || (
             <NBaseIcon clsPrefix={mergedClsPrefix}>
-              {{ default: () => iconMap[status] }}
+              {{ default: () => iconRenderMap[status]() }}
             </NBaseIcon>
           )}
         </div>