Сопоставление через конфигурацию и функции — Реагируйте

#reactjs #react-native

Вопрос:

Я хотел бы исключить свой повторяющийся код, который выглядит так:

 {dataOne.FAVOURITES.length > 0 amp;amp; DATA.CATEGORIES[1] !== undefined amp;amp; (
          <>
            <View>
              <MediumText style={styles.subtitle}>{DATA.CATEGORIES[1].title[0]}</MediumText>
            </View>
            <View>
              {dataOne.FAVOURITES.map((c: any, i: number) => (
                <Card key={i} data={c} isOperating={c.isOperating} />
              ))}
            </View>
          </>
        )}
        {dataTwo.FAVOURITES.length > 0 amp;amp; DATA.CATEGORIES[1] !== undefined amp;amp; (
          <>
            <View>
              <MediumText style={styles.subtitle}>{DATA.CATEGORIES[1].title[1]}</MediumText>
            </View>
            <View>
              {dataTwo.FAVOURITES.map((c: any, i: number) => (
                <Card key={i} data={c} isOperating={c.isOperating} />
              ))}
            </View>
          </>
        )}
 

также предположим, что

 const dataOne = useSelector(selectGroupedDataOne);
 

и пример заголовка, отображаемого непосредственно из файла конфигурации, выглядит следующим образом:

 ...
CATEGORIES: [
   
    { name: "Third Category", route: "CategoryThree", color: "#7A3D99", icon: "C", dataSet: ["5", "6"], title: ["X", "Y"] },
  ],
 

И список можно продолжать, каждый второй dataOne, dataTwo-это конкретный селектор redux с соответствующими фильтрами на нем.

Я хотел бы отобразить все селекторы redux (dataOne, dataTwo, dataThree и т. Д.), Используя заголовки из файла конфигурации. Я хотел отобразить его, но не смог правильно отобразить, так как приведенное ниже решение выдаст ошибку (оно ожидает строку и не может получить переменную из файла).

   const test = {
  DATA.CATEGORIES[0].title[0]: dataOne
  ...
  etc.
  } 
 

Как я могу это сделать? Для в цикле, для каждого? Есть идеи, как назначить переменную из конфигурации функции селектора?