Formik fieldarray 名称嵌套三层

Question

希望根据以下初始值得到一些帮助。 这只是我数据的一个片段，但我正在尝试在itinerary级别执行 Formik FieldArray，嵌套三个级别，但不确定要为这个 FieldArray 名称分配什么名称。

{itineraryGroups[itineraryDetails].map((idetail, index) => (

            <FieldArray
            name={`itineraryGroups.${index}.itineraryDetails.itinerary`}          
            render={(arrayHelpers) => (
              <React.Fragment>
                    {idetail.itinerary.map((i, idx) => (

只是不确定我的 FieldArray 名称应该在itinerary级别，因为这不起作用： name={ itineraryGroups.${index}.itineraryDetails.itinerary }

显然， itineraryDetails也是一个数组，所以不确定这是否也需要数组索引。

以下是我的初始值设置：

const itineraryGroup = {
          itineraryName: "",
          itineraryDetails: [
            {
              day: "Monday",
              itinerary: [
                {
                    day: "Day 1",
                    description: "description one"               
                }
              ]
            },
            {
              day: "Tuesday",
              itinerary: [
                {
                    day: "Day 2",
                    description: "description two",               
                }
              ]
            }                                                                       
          ]
      };
      
      
const INITIAL_FORM_STATE = {
  name: '',
  itineraryGroups: [itineraryGroup]
};

    <Formik
      enableReinitialize
      initialValues={{ 
        ...INITIAL_FORM_STATE
      }}    

Answer 1

如果itineraryGroups是一个只有 1 个元素的数组，就像您声明的那样，您可以像这样更新：

{itineraryGroups[0].itineraryDetails.map((idetail, index) => ( 

  <FieldArray
  name={`itineraryGroups[0].itineraryDetails[${index}].itinerary`}          
  render={(arrayHelpers) => (
    <React.Fragment>
          {idetail.itinerary.map((i, idx) => (

更新：如果itineraryGroups有多个元素，您需要添加更多map ：

{itineraryGroups.map((iGroup, indexGroup) => (
  {iGroup.itineraryDetails.map((idetail, index) => ( 
    <FieldArray
      name={`itineraryGroups[${indexGroup}].itineraryDetails[${index}].itinerary`}