vue3-core/packages/shared/src/toDisplayString.ts

74 lines
1.9 KiB
TypeScript

// enums are compiled away via custom transform so no real dependency here
import { ReactiveFlags } from '@vue/reactivity'
import {
isArray,
isFunction,
isMap,
isObject,
isPlainObject,
isSet,
isSymbol,
objectToString,
} from './general'
// can't use isRef here since @vue/shared has no deps
const isRef = (val: any): val is { value: unknown } => {
return !!(val && val[ReactiveFlags.IS_REF] === true)
}
/**
* For converting {{ interpolation }} values to displayed strings.
* @private
*/
export const toDisplayString = (val: unknown): string => {
switch (typeof val) {
case 'string':
return val
case 'object':
if (val) {
if (isRef(val)) {
return toDisplayString(val.value)
} else if (
isArray(val) ||
val.toString === objectToString ||
!isFunction(val.toString)
) {
return JSON.stringify(val, replacer, 2)
}
}
default:
return val == null ? '' : String(val)
}
}
const replacer = (_key: string, val: unknown): any => {
if (isRef(val)) {
return replacer(_key, val.value)
} else if (isMap(val)) {
return {
[`Map(${val.size})`]: [...val.entries()].reduce(
(entries, [key, val], i) => {
entries[stringifySymbol(key, i) + ' =>'] = val
return entries
},
{} as Record<string, any>,
),
}
} else if (isSet(val)) {
return {
[`Set(${val.size})`]: [...val.values()].map(v => stringifySymbol(v)),
}
} else if (isSymbol(val)) {
return stringifySymbol(val)
} else if (isObject(val) && !isArray(val) && !isPlainObject(val)) {
// native elements
return String(val)
}
return val
}
const stringifySymbol = (v: unknown, i: number | string = ''): any =>
// Symbol.description in es2019+ so we need to cast here to pass
// the lib: es2016 check
isSymbol(v) ? `Symbol(${(v as any).description ?? i})` : v