有没有办法在payload cms中进行子选择输入？

Question

export const PRODUCT_CATEGORIES = [
    {
      label: 'UI Kits',
      value: 'ui_kits' as const,
      subcat:[{name:'ui_kits1',value:'ui_kits1' as const},{name:'ui_kits2',value:'ui_kits2' as const}],
    },
    {
      label: 'Fonts',
      value: 'fonts' as const,
      subcat:[{name:'1',value:'lu1n1d' as const},{name:'font2',value:'font2' as const}],
      
    },]

目前通过在单个选择字段中列出所有子目录来完成：

 {
  name: 'category',
  label: 'Category',
  type: 'select',
  options: PRODUCT_CATEGORIES.map(
    ({ label, value}) => ({ label, value })
  ),
  required: true,
},
 

{
  name:'subcat',
  label:'subcat',
  type:'select',
  options:  PRODUCT_CATEGORIES
  .filter(category => category.subcat)
  .flatMap(category => category.subcat.map(subcategory => subcategory.name))
},

有没有办法根据主类别选择显示内部子目录？谢谢！

Answer 1

不确定这是否是最好的方法，但你可能可以这样做。

 const PRODUCT_CATEGORIES = [
  {
    label: "UI_Kits",
    value: "ui_kits",
    subcat: [
      { label: "ui_kits1", value: "ui_kits1"},
      { label: "ui_kits2", value: "ui_kits2"},
    ],
  },
  {
    label: "Fonts",
    value: "fonts",
    subcat: [
      { label: "1", value: "lu1n1d"},
      { label: "font2", value: "font2"},
    ],
  },
];


fields: [    
  {
    name: "category",
    label: "Category",
    type: "select",
    options: PRODUCT_CATEGORIES.map(({ label, value }) => ({ label, value 
    })),
    required: true,
   },    
   ...(PRODUCT_CATEGORIES.map((subcat) => {
      return {
        name: `subcat${subcat.label}`,
        label: `subcat`,
        type: "select",
        options: subcat.subcat.map(({ label, value }) => ({ label, value 
        })),
        admin: {
            condition: (siblingdata) => {
            if (siblingdata["category"] === subcat.value) {
              return true;
            } else {
              return false;
            }
          },
        },
      };
    }) as Field[]),    
  ],