fix: 修复动态导入的问题,保留 redirectComponent 配置的灵活性

This commit is contained in:
tnt group 2023-05-26 16:51:05 +08:00
parent 8867a489a2
commit bb48745484
10 changed files with 16 additions and 31 deletions

View File

@ -1,4 +1,4 @@
import { IconConfig } from '../Icon/index'
import { IconConfig } from '../Default/Icon/index'
import { PackagesCategoryEnum } from '@/packages/index.d'
import { ChatCategoryEnum, ChatCategoryEnumName } from '../index.d'
@ -78,7 +78,7 @@ const iconList = iconNames.map(name => ({
icon: name,
dataset: name,
title: name.replace('uim:', ''),
redirectComponent: './components/Icons/Icon' // 虚拟组件路径,尾部不跟 /’,相对于 /packages/index.ts 文件的位置
redirectComponent: 'Icons/Default/Icon' // 跳转组件路径规则packageName/categoryName/componentKey
}))
export default iconList

View File

@ -1,5 +1,5 @@
import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d'
import { ChatCategoryEnum, ChatCategoryEnumName } from '../index.d'
import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d'
export const IconConfig: ConfigType = {
key: 'Icon',

View File

@ -1,4 +1,4 @@
import { IconConfig } from '../Icon/index'
import { IconConfig } from '../Default/Icon/index'
import { PackagesCategoryEnum } from '@/packages/index.d'
import { ChatCategoryEnum, ChatCategoryEnumName } from '../index.d'
@ -39,7 +39,7 @@ const iconList = iconNames.map(name => ({
icon: name,
dataset: name,
title: name.replace('line-md:', ''),
redirectComponent: './components/Icons/Icon' // 虚拟组件路径,尾部不跟 /’,相对于 /packages/index.ts 文件的位置
redirectComponent: 'Icons/Default/Icon' // 跳转组件路径规则packageName/categoryName/componentKey
}))
export default iconList

View File

@ -1,4 +1,4 @@
import { IconConfig } from '../Icon/index'
import { IconConfig } from '../Default/Icon/index'
import { PackagesCategoryEnum } from '@/packages/index.d'
import { ChatCategoryEnum, ChatCategoryEnumName } from '../index.d'
@ -47,7 +47,7 @@ const iconList = iconNames.map(name => ({
icon: name,
dataset: name,
title: name.replace('wi:', ''),
redirectComponent: './components/Icons/Icon' // 虚拟组件路径,尾部不跟 /’,相对于 /packages/index.ts 文件的位置
redirectComponent: 'Icons/Default/Icon' // 跳转组件路径规则packageName/categoryName/componentKey
}))
export default iconList

View File

@ -53,7 +53,7 @@ const addConfig = {
chartFrame: ChartFrameEnum.STATIC,
title: '点击上传图片',
image: 'upload.png',
redirectComponent: './components/Informations/Mores/Image', // 虚拟组件路径,尾部不跟 /’,相对于 /packages/index.ts 文件的位置
redirectComponent: 'Informations/Mores/Image', // 跳转组件路径规则packageName/categoryName/componentKey
disabled: true,
configEvents: {
// 点击上传事件
@ -74,7 +74,7 @@ const addConfig = {
title: e.fileName,
image: e.url,
dataset: e.url,
redirectComponent: './components/Informations/Mores/Image' // 虚拟组件路径,尾部不跟 /’,相对于 /packages/index.ts 文件的位置
redirectComponent: 'Informations/Mores/Image' // 跳转组件路径规则packageName/categoryName/componentKey
}
userPhotosList.unshift(newPhoto)
// 存储在本地数据中

View File

@ -17,7 +17,7 @@ const photoConfigList = imageList.map(i => ({
image: i.imageUrl,
dataset: i.imageUrl,
title: i.imageName,
redirectComponent: './components/Informations/Mores/Image' // 虚拟组件路径,尾部不跟 /’,相对于 /packages/index.ts 文件的位置
redirectComponent: 'Informations/Mores/Image' // 跳转组件路径规则packageName/categoryName/componentKey
}))
export default photoConfigList

View File

@ -31,28 +31,13 @@ export let packagesList: PackagesType = {
* @param targetData
*/
export const createComponent = async (targetData: ConfigType) => {
const { package: packageName } = targetData
if (packageName === PackagesCategoryEnum.ICONS) {
return createIconComponent()
} else if (packageName === PackagesCategoryEnum.PHOTOS) {
return createPhotoComponent()
} else {
return createDefaultComponent(targetData)
const { redirectComponent, category, key } = targetData
// redirectComponent 是给图片组件库和图标组件库使用的
if (redirectComponent) {
const [packageName, categoryName, keyName] = redirectComponent.split('/')
const redirectChart = await import(`./components/${packageName}/${categoryName}/${keyName}/config.ts`)
return new redirectChart.default()
}
}
export const createIconComponent = async () => {
const chart = await import(`./components/Icons/Icon/config`)
return new chart.default()
}
export const createPhotoComponent = async () => {
const chart = await import(`./components/Informations/Mores/Image/config`)
return new chart.default()
}
export const createDefaultComponent = async (targetData: ConfigType) => {
const { category, key } = targetData
const chart = await import(`./components/${targetData.package}/${category}/${key}/config.ts`)
return new chart.default()
}