Question

我有分配了架构对象的项目（带有文本的图像）。对象也可以分配其他模式。共有6种不同的模式，它们是静态的（即“浅”，“暗”，“蓝色”等）。

当前结构：

export interface Item {
  name: string
  category: number
  default_schema: Colorschema 
  alt_schemas?: Colorschema []
}

export interface Colorschema {
  name: string
  img: string
}

样本数据：

const myItems = [{ 
    name: 'Name',
    category: 1,
    default_schema: { name:'text, img:'123.png'},
    alt_schemas: [{ name:'text, img:'123.png'},
                  { name:'text, img:'123.png'},
                  { name:'text, img:'123.png'},
                  { name:'text, img:'123.png'},
                  { name:'text, img:'123.png'},
                  { name:'text, img:'123.png'}
},
{ 
    name: 'Name',
    category: 2,
    default_schema: { name:'text, img:'123.png'},
    alt_schemas: [{ name:'text, img:'123.png'},
                  { name:'text, img:'123.png'}
},
{ 
    name: 'Name',
    category: 1,
    default_schema: { name:'text, img:'123.png'}
}]

然后我将访问alt_schemas数组的嵌套图像，如下所示：

  const someImage = myItems[1]['alt_schemas'][2]['img']; //may be undefined if property does not exist, which is fine

但是，通过这种方法，我不知道someImage的图像属于哪个架构（换句话说，我不知道上面的示例中ID为2的架构）。

如前所述，这些模式定义明确，因此我需要一种方法，例如，直接访问模式“ dark”的alt_schema。我能想到的唯一方法是添加另一个接口，然后将嵌套的对象数组转换为对象数组的嵌套数组：

export interface Item {
  name: string
  category: number
  default_schema: Colorschema 
  alt_schemas?: AltColorschema []
}

export interface AltColorschema {
  identifier: string
  schema: Colorschema
}

export interface Colorschema {
  name: string
  img: string
}

具有这样的示例结构：

[{ 
name: 'Name',
category: 2,
default_schema: { name:'text, img:'123.png'},
alt_schemas: [ {
               identifier: 'light', 
               schema: { name:'text, img:'123.png'}
               },
               {
               identifier: 'dark', 
               schema: { name:'text, img:'123.png'}
               },
               {
               identifier: 'blue', 
               schema: { name:'text, img:'123.png'}
               } ]
}, { ... } ]

但是，对我而言，这似乎有点过头了。

没有办法通过为6个可能的数组元素值定义数组索引值来反映模式标识符来解决此问题吗？

Answer 1

重新考虑这一点之后，我可能会降低复杂性并执行以下操作：

clickListener()

我认为毕竟没有必要嵌套另一个对象数组。

嵌套数组/对象结构的标识符

1 个答案: