React - 回调的关闭问题

Question

我一直对我的猜测是关闭有一些问题，我只是在猜测，因为看起来我并不像我想象的那样理解它。问题来了：

我正在尝试使用 Stomp 建立 Web 套接字连接。它的工作方式是，你创建一个 stomp 客户端

let stompClient = Stomp.over(socket);

然后你订阅一些路由，传入路由并传入一个回调，当该路由被命中时会被调用

stompClient.subscribe("/topic/some-route",(message) => myCallback(message))

由于创建客户端似乎是一次性的事情，我决定将它放在一个 useEffect 钩子中，在数组中没有依赖项，这样客户端只会在组件挂载时创建。

useEffect(() => {
//some unimportant setup

let stompClient = Stomp.over(socket);

stompClient.subscribe("/topic/some-route",(message) => myCallback(message))

}, [])

我还在我的组件中保留了一些状态，为了简单起见，假设我保留了这个：

const [counter, setCounter] = useState(0);

我想要我的回调做的只是打印出状态，所以：

const myCallback = (message /* the message variable is unimportant here */ ) => {
console.log(counter);
}

现在，当用户使用该应用程序时，counter 状态将发生变化，但每当触发回调时，它总是打印 0。使用我所拥有的关闭知识，我猜... :（这是问题#1）

1. 因为函数闭包（上下文这个词似乎更适合我）在创建函数时被初始化，所以函数将 counter 变量作为 0，这就是它总是打印 0 的原因。这种说法正确吗？

如果我将stompClient.subscribe("/topic/some-route",(message) => myCallback(message)) 移到useEffect 钩子之外，myCallback 函数将打印出当前状态，但是，考虑到这个.subscribe(...) 函数为我的 stomp 代理创建了一个全新的订阅，我最终会得到数百个订阅，每个状态更新一个，这显然不是一个解决方案。这让我想到了问题 #2，

1. 考虑到我只需要调用这个.subscribe(message, callback) 函数一次，我怎样才能传入反映我状态的回调？

谢谢！

Answer 1

您是否尝试过从回调中调用一个函数，然后从该函数记录状态？

const myCallBack = (message) => {
  onMessageReceived();
}

const onMessageReceived = () => {
  console.log(counter);
}

也许？