Как отобразить один компонент для разных вызовов api в react-native.?

#reactjs #react-native #api #if-statement

#reactjs #react-native #API #if-оператор

Вопрос:

Я новичок в react-native, пытаюсь отобразить одно значение для двух значений api. проблема в том, что я получаю повторяющиеся вызовы компонентов для двух значений, тогда как я хочу, чтобы оно отображалось только один раз. ниже приведен мой код

  if (item.current== 0 amp;amp; item.overdue==0 ) {
                    return (
                      <View style={{ flex: 2, alignItems: "center" }}>
                        <Text
                          style={{
                            fontSize: _font(11),
                            color: colours.green,
                          }}
                        >
                          <Icon
                            size={18}
                            color="green"
                            name="checkcircleo"
                            type="AntDesign"
                          />
                          
                        </Text>
                        <Text
                          style={{
                            fontSize: _font(15),
                            color: colours.green,
                            marginTop:10
                          }}
                        >
                         TASKS ARE COMPLETED
                        </Text>
                      </View>
                    );
                  }
                }}
              />
            </View>
          </View>
  

Это мой вывод вызова api
здесь вы можете увидеть два разных объекта

И мой вывод ниже, это мой вывод, я получаю два завершенных всех

в то время как я хочу получить такой результат, кто-нибудь может сказать мне, как это делается

Комментарии:

1. Можете ли вы поделиться кодом родительского компонента?

2. @OzanManav я не могу слишком долго для stackoverflow

Ответ №1:

Я думаю, что вы повторно передаете 2 значения, которые заставляют его отображать 2 раза. Лучше, если вы добавите раздел кода, который вызывает приведенный выше код. Как я себе представляю, ваш код выглядит следующим образом

 <Text> Tasks Due <Text> 
{ values.map(item => renderItem(item)}
  

Для проверки вы можете добавить

 <Text> {item.dairy_name} <Text>
  

при рендеринге, чтобы вы могли видеть, какое значение отображается.

Итак, визуализируйте только 1 элемент, а не массив значений.