分层菜单

分层菜单是一个显示分层菜单的组件。它通常用于具有子类别的类别。

设置

以下文档已在 Elasticsearch 中建立索引

{
  "brand": "Apple",
  "product": "Macbook Pro 14",
  "category_lvl1": "Electronics",
  "category_lvl2": "Electronics > Computers",
  "category_lvl3": "Electronics > Computers > Laptops"
}

或者，如果文档属于多个类别，可以将其索引为数组

{
  "brand": "Apple",
  "product": "Macbook Pro 14",
  "category_lvl1": ["Electronics", "School Equipment"],
  "category_lvl2": ["Electronics > Computers", "School Equipment > Computers"],
  "category_lvl3": ["Electronics > Computers > Laptops", "School Equipment > Computers > Laptops"]
}

Searchkit 设置

设置以下 facet_attributes

{
  facet_attributes: [
    { 
      attribute: 'category_lvl1', 
      field: 'category_lvl1.keyword', 
      type: 'string' 
    },
    { 
      attribute: 'category_lvl2', 
      field: 'category_lvl2.keyword', 
      type: 'string' 
    },
    { 
      attribute: 'category_lvl3', 
      field: 'category_lvl3.keyword', 
      type: 'string' 
    },
  ]
}

嵌套字段

您还可以使用嵌套字段来定义分面属性。当您需要保留对象关系时，这很有用。阅读有关嵌套字段的更多信息此处

组件用法

以下示例显示了一个具有 3 个类别级别的 HierarchicalMenu。

<HierarchicalMenu
  attributes={[
    'category_lvl1',
    'category_lvl2',
    'category_lvl3',
  ]}
/>

文档

细化列表数字菜单