react-native - React Native：在数组中插入新对象

问题描述

成功实现套接字后，我现在可以从一个屏幕到另一个屏幕收听我的事件。我现在的问题是我想显示我在平面列表中获得的新对象。

这是新的 msg 对象：

messages: Object { "conversationId": 33, "message": "Heyy", "receiverId": 43, "senderId": 53, }

这是我的代码：

const [listings, setListings] = useState([]);

const loadListings = async () => {
setLoading(true);
const response = await messagesApi.getMessages();
setLoading(false);
if(refreshing) setRefreshing(false);
if (!response.ok) return setError(true);
setError(false);
setListings(response.data)
};

useEffect(() => {
const newsocket = sockets(user.id);
setSocket(newsocket);
newsocket.on("send_message", (msg) => {
  console.log("messages:", msg);
  setListings(listings => [...listings,msg]);
});
loadListings()
}, []);

return (
<FlatList
    data={listings}
    keyExtractor={(listing) => listing.id.toString()}
    renderItem={({ item,index }) => (
      <MessagesList
      title={item.Listing.title}
        subTitle={item.Messages[0].message}
        imageUrl={item.images[0].url}
        thumbnailUrl={item.images[0].thumbnailUrl}
        // onPress={() => console.log("message selected", item)}
        onPress={() => navigation.navigate(routes.CHAT, 
                 {message:item,index,updateView,newsocket:socket})}
      />
    )}
  />
)

当我运行此代码时，我不断得到TypeError: undefined is not an object evaluating listing.id.toString.

我想我收到了这个错误，因为这个新的消息对象想要在没有获取数据库的情况下实时呈现，因此它仍然没有被赋予一个 ID。

我该如何继续解决这个问题？

附加信息

console.log(listings[0]) 打印这个

Object{ 
        "id":33,
       "Listing":{    
                  "title": "test",
                 },
       "Messages":Array[
                  Object {
                          "conversationId": 33,
                          "id": 601,
                          "message": "Hey",
                          },
                   Object {
                          "conversationId": 33,
                          "id": 600,
                          "message": "Hey",
                          },
                        ],
        "images":Array[
                 Object {"url":"","thumbnailUrl":""}]
      }

console.log(listings.map(x=>x.Messages))

 Array[
       Array[
                  Object {
                          "conversationId": 33,
                          "id": 601,
                          "message": "Hey",
                          },
                   Object {
                          "conversationId": 33,
                          "id": 600,
                          "message": "Hey",
                          },
            ],
      Array[
                  Object {
                          "conversationId": 1,
                          "id": 2,
                          "message": "Hey",
                          },
                   Object {
                          "conversationId": 1,
                          "id": 1,
                          "message": "Hey",
                          },
             ],
         ],

我也试过这个

 useEffect(()=>{
 const x =listings.map(x=>x.id)
 console.log(x)
 },[listings])

这打印出以下内容：

Array [
32,
33,
29,
15,
27,
25,
26,
4,
17,
]

我现在需要在添加我的 msg 对象之前检查特定的对话。

标签： react-native

react-native - React Native：在数组中插入新对象

问题描述

解决方案

推荐阅读