你好,我试图创建一个网络会议室与webRTC和WebSocket,可以由任何数量的用户使用。为此,每当新用户想要加入时,都会发送包含报价或答案的消息。
例如,如果第三个用户想要连接到其他用户,他将收到两个createoffer消息。对于每个createoffer,用户应该存储在状态中。这意味着该列表会重复获得多一个用户。但是,在该状态中仅添加了1个用户,而不是2个。我使用状态而不是引用,因为我希望在添加新用户时应用程序重新呈现。
我该怎么解决呢?
这是重要的代码
const [connectionList, setConnectionList] = useState([]);
webSocket.current.onmessage = function (e) {
let msgDispatcher = JSON.parse(e.data);
console.log("msgDispatcher", msgDispatcher);
if (msgDispatcher.pcCommand == "broadcast") {
console.log("prepare Connection");
let pc = new PeerConnection();
pc.getMedia();
setConnectionList([...connectionList, {
fromUserID: msgDispatcher.fromUserID,
connection: pc,
id: uuid()
}]);
webSocket.current.send(JSON.stringify({
sendType: "toUser",
toUserID: msgDispatcher.fromUserID,
fromUserID: userID,
pcCommand: "createOffer"
}));
}
if (msgDispatcher.pcCommand == "createOffer") {
console.log("createOffer");
let pc = new PeerConnection();
pc.getMedia().then((e) => {
pc.createOffer(webSocket.current, userID, msgDispatcher.fromUserID);
//here is the problem
setConnectionList([...connectionList, {
fromUserID: msgDispatcher.fromUserID,
connection: pc,
id: uuid()
}])
})
}
我无法设置本地列表先保存用户,然后再将其设置为新状态。我认为,设置第二个列表作为参考也不是解决方案,因为列表是多余的。我没有办法解决这个问题。
2条答案
按热度按时间yvfmudvl1#
我已经找到了一个适合我的解决方案,但不知道是否有更好的解决方案。
您只需在存储用户的函数之外定义一个堆栈列表。最后,这个堆栈被放入状态,它应该工作。
如果状态改变,那么堆栈再次为空,并使用它重置自身。
下面是代码
u3r8eeie2#
有更好的解决办法。您可以在状态更新之前使用内部状态并进一步更改它。因此,您可以使用内部状态,而不是创建变量。
反而
做了
因此不再需要局部变量stackConnection