diff --git a/components/_util/utils.ts b/components/_util/utils.ts index 0e52cb4e..f99ea320 100644 --- a/components/_util/utils.ts +++ b/components/_util/utils.ts @@ -168,3 +168,14 @@ export function concat(arr: any[], arr2: any[]) { } return arr; } + +// JSON.stringify +export function stringify(value: any, onError?: (err: unknown) => void, fallbackValue: string = ''): string { + try { + const str = JSON.stringify(value); + return str; + } catch (err) { + onError?.(err); + return fallbackValue; + } +} diff --git a/components/table/components/cell.tsx b/components/table/components/cell.tsx index fcb00db8..9b019070 100644 --- a/components/table/components/cell.tsx +++ b/components/table/components/cell.tsx @@ -14,6 +14,7 @@ import { provideKey } from '../const'; import type { ActionType } from '../interface'; import type { ColumnInst } from '../column'; +import { stringify } from '../../_util/utils'; const cellProps = { row: { @@ -40,8 +41,10 @@ const cellProps = { export type InnerCellProps = ExtractPropTypes; +const COMPONENT_NAME = 'FTableCell'; + export default defineComponent({ - name: 'FTableCell', + name: COMPONENT_NAME, props: cellProps, setup(props) { const { prefixCls } = inject(provideKey); @@ -102,13 +105,14 @@ export default defineComponent({ const result = formatterResult ?? cellValue; Object.assign(ellipsisProps, { content: result }); return hasEllipsis - ? ( - - ) + ? : ( {typeof result === 'object' - ? JSON.stringify(result) + ? stringify( + result, + (err) => console.warn(`[${COMPONENT_NAME}]: render error occurred due to \n`, err), + ) : result} );