React 里关于 html dom 节点 ref 的引用放哪里比较好,以及在 redux ,zustand 这类框架持有 解析 JSON.stringify()报错的问题

1. 放 useContext 里,目前可接受

2. 放 redux zustand 里。 不过这样子相关的 redux devtool 中间件会报错失效 因为存在 JSON.stringify 无法解析的问题,关闭中间件调试起来会有点麻烦

3.  通过传递 ref, 感觉这种写法有点累

比起传递 ref ，感觉传递操作 ref 的方法比较好吧

说说具体需求

https://redux.js.org/style-guide/#do-not-put-non-serializable-values-in-state-or-actions

页面最顶层放一个 context

放了会因为无法序列化影响 devtools 的使用，并不是说绝对不能放

我觉得 ref 传来传去纯属多余，不如返璞归真，
1.用的时候去 querySelector ，jquery 玩法。看你贴的代码里面 ref 都是 div 类型，估计是没挂什么 ImperativeHandle ，光拿 dom ，你代码里面贴的部分，byId 就够用了，也不会太混乱
2.如果挂了 ImperativeHandle 的话就改成在目标组件注册事件监听。通过事件机制调用方法。