Reactjs 为什么我在使用websocket时使用了infity循环?
我现在将weboscket添加到应用程序中,当添加新用户时,我必须尝试更新活动用户数组,但当我在结果参数[activeUsersInGallery]中加入useEffect时,然后将请求发送到weboscket。我现在不知道为什么Reactjs 为什么我在使用websocket时使用了infity循环?,reactjs,websocket,use-effect,Reactjs,Websocket,Use Effect,我现在将weboscket添加到应用程序中,当添加新用户时,我必须尝试更新活动用户数组,但当我在结果参数[activeUsersInGallery]中加入useEffect时,然后将请求发送到weboscket。我现在不知道为什么 function Seller() { const [activeUsersInGallery, setActiveUsersInGallery] = useState([]); const [checkMultipleClient, setCheckMultip
function Seller() {
const [activeUsersInGallery, setActiveUsersInGallery] = useState([]);
const [checkMultipleClient, setCheckMultipleClient] = useState([]);
function goToCheckCustomer(idClient) {
setCheckMultipleClient([...checkMultipleClient, idClient]);
}
async function connectionToWebSocketRooms() {
let response = await getConnection();
return response
}
async function getActiveUsers(pageNumber) {
let response = await connectionToWebSocketRooms();
let data = await response
.invoke("GetActiveUsers", pageNumber);
await response
.on("updateActiveUsers", (user, operationType) => updateActiveUsers(user, operationType))
setActiveUsersInGallery(data);
console.log(data)
return data;
}
function updateActiveUsers(user, operationType) {
console.log(user)
if ( operationType === 'update' || operationType === 'add') {
setActiveUsersInGallery([...activeUsersInGallery, user])
return activeUsersInGallery
} else if (operationType === 'remove'){
const removeClientOnArray = [...activeUsersInGallery.filter(filterArrWhenRemoveUser => filterArrWhenRemoveUser.id !== user.id)];
setActiveUsersInGallery(removeClientOnArray);
}
}
useEffect(() => {
getActiveUsers(1);
}, [activeUsersInGallery]);
return (
//...some code
)
}
每次ActiveUsersGallery更改引用时,useEffect都会触发。就你而言,问题就在这里
async function getActiveUsers(pageNumber) {
let response = await connectionToWebSocketRooms();
let data = await response
.invoke("GetActiveUsers", pageNumber);
await response
.on("updateActiveUsers", (user, operationType) => updateActiveUsers(user, operationType))
setActiveUsersInGallery(data);
console.log(data)
return data;
}
将在此代码的响应上创建一个新的对象引用,以等待响应。invokeGetActiveUsers,pageNumber