Блог

 const [toFollow, setToFollow] = useState('follow')

const follow = (user_id) => {
        users amp;amp; users.map(user => {
                if(user.user_id !== user_id){
                  setToFollow('following')
                }   
            })  
  }
 

это массив. проблема в том, что весь следующий реквизит изменяется, когда я просто хочу, чтобы для изменения был выбран только идентификатор

   <FlatList
      style={{marginBottom: 60}}
      showsVerticalScrollIndicator = {false}
      data={users amp;amp; users}
      renderItem={({ item }) => (
      <UserFollowCard
        p_image={item.profile_image}
        name={item.name_of_user}
        username={item.username}
        textToFollow={toFollow}
        follow = {() => follow(item.user_id)}
      />
          )}
           keyExtractor={item => item.user_id}
   />

t

this is the flatlist rendering the array with the component
 

Я предполагаю, что пользователи — это состояние, и я могу изменять пользователей с помощью setUsers.

 const follow = (user_id) => {
         setUsers(users.map(user => user.id === user_id ? { ...user, follow: !user.follow } : user ))
}
 

Сначала я создаю дополнительный ключ в объекте users и устанавливаю его для переключения true / false.

Затем в вашем компоненте.

   <UserFollowCard
    p_image={item.profile_image}
    name={item.name_of_user}
    username={item.username}
    textToFollow={item.follow ? "I am following" : "I am not following"}
    follow = {() => follow(item.user_id)}
  />
 

Я использую тенарный оператор, чтобы проверить, верно ли значение follow, и отобразить другое сообщение.

Вам также необходимо установить ExtraData={users}, чтобы он отображался повторно

Я не очень понимаю вопрос. Вы можете изменить заголовок кнопки на основе условий. Я написал некоторый код, вот ссылка. Вместо кнопки вы можете использовать TouchableOpacity.