tdesign-mobile-vue
Version:
tdesign-mobile-vue
1 lines • 9.89 kB
Source Map (JSON)
{"version":3,"file":"tnode.mjs","sources":["../../src/hooks/tnode.ts"],"sourcesContent":["import { h, getCurrentInstance, ComponentInternalInstance, VNode } from 'vue';\nimport isFunction from 'lodash/isFunction';\nimport camelCase from 'lodash/camelCase';\nimport kebabCase from 'lodash/kebabCase';\nimport { getDefaultNode, getParams, OptionsType, JSXRenderContext, getSlotFirst } from './render-tnode';\n\n// 兼容处理插槽名称，同时支持驼峰命名和中划线命名，示例：value-display 和 valueDisplay\nfunction handleSlots(instance: ComponentInternalInstance, name: string, params: Record<string, any>) {\n // 2023-08 new Function 触发部分使用场景安全策略问题（Chrome插件/eletron等）\n // // 每个 slots 需要单独的 h 函数 否则直接assign会重复把不同 slots 的 params 都注入\n // const finalParams = new Function('return ' + h.toString())();\n // if (params) {\n // Object.assign(finalParams, params);\n // }\n\n // 检查是否存在 驼峰命名 的插槽（过滤注释节点）\n let node = instance.slots[camelCase(name)]?.(params);\n if (node && node.filter((t) => t.type.toString() !== 'Symbol(v-cmt)').length) return node;\n // 检查是否存在 中划线命名 的插槽\n node = instance.slots[kebabCase(name)]?.(params);\n if (node && node.filter((t) => t.type.toString() !== 'Symbol(v-cmt)').length) return node;\n return null;\n}\n\n/**\n * 是否为空节点，需要过滤掉注释节点。注释节点也会被认为是空节点\n */\nfunction isEmptyNode(node: any) {\n if ([undefined, null, ''].includes(node)) return true;\n const innerNodes = node instanceof Array ? node : [node];\n const r = innerNodes.filter((node) => node?.type?.toString() !== 'Symbol(Comment)');\n return !r.length;\n}\n\n/**\n * 通过 JSX 的方式渲染 TNode，props 和 插槽同时处理，也能处理默认值为 true 则渲染默认节点的情况\n * 优先级：Props 大于插槽\n * 如果 props 值为 true ，则使用插槽渲染。如果也没有插槽的情况下，则使用 defaultNode 渲染\n * @example const renderTNodeJSX = useTNodeJSX()\n * @return () => {}\n * @param name 插槽和属性名称\n * @param options 值可能为默认渲染节点，也可能是默认渲染节点和参数的集合\n * @example renderTNodeJSX('closeBtn') 优先级 props function 大于 插槽\n * @example renderTNodeJSX('closeBtn', <close-icon />)。 当属性值为 true 时则渲染 <close-icon />\n * @example renderTNodeJSX('closeBtn', { defaultNode: <close-icon />, params })。 params 为渲染节点时所需的参数\n */\nexport const useTNodeJSX = () => {\n const instance = getCurrentInstance();\n return function (name: string, options?: OptionsType) {\n // assemble params && defaultNode\n const params = getParams(options);\n const defaultNode = getDefaultNode(options);\n const slotFirst = getSlotFirst(options);\n\n // 处理 props 类型的Node\n let propsNode;\n if (Object.keys(instance.props).includes(name)) {\n propsNode = instance.props[name];\n }\n\n // 是否静默日志\n // const isSilent = Boolean(isObject(options) && 'silent' in options && options.silent);\n // // 同名插槽和属性同时存在，则提醒用户只需要选择一种方式即可\n // if (instance.slots[name] && propsNode && propsNode !== true && !isSilent) {\n // log.warn('', `Both slots.${name} and props.${name} exist, props.${name} is preferred`);\n // }\n // propsNode 为 false 不渲染\n if (propsNode === false || propsNode === null) return;\n if (propsNode === true) {\n return handleSlots(instance, name, params) || defaultNode;\n }\n\n // 同名 props 和 slot 优先处理 props\n if (isFunction(propsNode)) return propsNode(h, params);\n const isPropsEmpty = [undefined, params, ''].includes(propsNode);\n if ((isPropsEmpty || slotFirst) && (instance.slots[camelCase(name)] || instance.slots[kebabCase(name)])) {\n return handleSlots(instance, name, params);\n }\n return propsNode;\n };\n};\n\n/**\n * 在setup中，通过JSX的方式 TNode，props 和 插槽同时处理。与 renderTNodeJSX 区别在于属性值为 undefined 时会渲染默认节点\n * @example const renderTNodeJSXDefault = useTNodeDefault()\n * @return () => {}\n * @param name 插槽和属性名称\n * @example renderTNodeJSXDefault('closeBtn')\n * @example renderTNodeJSXDefault('closeBtn', <close-icon />) closeBtn 为空时，则兜底渲染 <close-icon />\n * @example renderTNodeJSXDefault('closeBtn', { defaultNode: <close-icon />, params }) 。params 为渲染节点时所需的参数\n */\nexport const useTNodeDefault = () => {\n const renderTNodeJSX = useTNodeJSX();\n return function (name: string, options?: VNode | JSXRenderContext) {\n const defaultNode = getDefaultNode(options);\n return renderTNodeJSX(name, options) || defaultNode;\n };\n};\n\n/**\n * 在setup中，用于处理相同名称的 TNode 渲染\n * @example const renderContent = useContent()\n * @return () => {}\n * @param name1 第一个名称，优先级高于 name2\n * @param name2 第二个名称\n * @param defaultNode 默认渲染内容：当 name1 和 name2 都为空时会启动默认内容渲染\n * @example renderContent('default', 'content')\n * @example renderContent('default', 'content', '我是默认内容')\n * @example renderContent('default', 'content', { defaultNode: '我是默认内容', params })\n */\nexport const useContent = () => {\n const renderTNodeJSX = useTNodeJSX();\n return function (name1: string, name2: string, options?: VNode | JSXRenderContext) {\n // assemble params && defaultNode\n const params = getParams(options);\n const defaultNode = getDefaultNode(options);\n\n const toParams = params ? { params } : undefined;\n\n const node1 = renderTNodeJSX(name1, toParams);\n const node2 = renderTNodeJSX(name2, toParams);\n\n const res = isEmptyNode(node1) ? node2 : node1;\n return isEmptyNode(res) ? defaultNode : res;\n };\n};\n"],"names":["handleSlots","instance","name","params","_instance$slots$camel","_instance$slots","_instance$slots$kebab","_instance$slots2","node","slots","camelCase","call","filter","t","type","toString","length","kebabCase","isEmptyNode","includes","innerNodes","Array","r","_node2$type","useTNodeJSX","getCurrentInstance","options","getParams","defaultNode","getDefaultNode","slotFirst","getSlotFirst","propsNode","Object","keys","props","isFunction","h","isPropsEmpty","useTNodeDefault","renderTNodeJSX","useContent","name1","name2","toParams","node1","node2","res"],"mappings":"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"}