Плоский список не отображается повторно при изменении данных

#reactjs #react-native

#reactjs #react-native

Вопрос:

У меня есть массив разговоров и функция, которая проверяет, подключен ли получатель к Сети. Однако, когда эта функция изменяет возвращаемое значение (логическое значение), flatlist НЕ выполняет повторную визуализацию. Я пробовал ExtraData, но безуспешно. Мой код:

Плоский список

         <FlatList
              data={conversations}
              extraData={isRefreshing}
              renderItem={(conversation) => (
                <TouchableOpacity
                  onPress={() => selectConversation(conversation.item)}
                  style={{
                    flexDirection: "row",
                    justifyContent: "space-between",
                    alignItems: "center",
                    borderBottomWidth: 1,
                    padding: 5,
                    marginBottom: 5,
                  }}
                >
                  <View>
                    <Text>{getRecipient(conversation.item).displayName}</Text>
                    <Text>{conversation.item.latestMessage}</Text>
                  </View>
                  {isUserOnline(conversation.item) amp;amp; (
                    <Text style={{ color: "green" }}>ONLINE</Text>
                  )}
                </TouchableOpacity>
              )}
              keyExtractor={(item) => item._id}
            />
  

Эффект использования

   useEffect(() => {
    let handler = (data) => {
      console.log(data);
      setOnlineUsers((prevState) => {
        return data;
      });
      setRefreshing(!isRefreshing);
    };
    const unsubscribe = navigation.addListener("focus", () => {
      console.log("focused");
      socket.on("online-users-data", handler);
      socket.emit("join-online-users");
      getConversations();
    });

    return () => {
      socket.emit("leave-online-users");
      socket.off("online-users-data", handler);
      unsubscribe();
    };
  }, []);
  

isUserOnline()

   function isUserOnline(conversation) {
    const user = getRecipient(conversation);
    const onlineUser = onlineUsers.find((u) => u.userId === user._id);

    return (
      user amp;amp; onlineUser amp;amp; user._id.toString() === onlineUser.userId.toString()
    );
  }
  

Ответ №1:

Я решил это, добавив onlineUsers в extraData . Черт возьми, это сбивало с толку.