你需要一个状态管理插件，以前我用 redux mobx 。
react 16 推出 hooks 后我使用 https://github.com/jamiebuilds/unstated-next/blob/master/README-zh-cn.md

readme 的指南部分，有介绍这个库的设计思路，就是用简单封装一下 react 的 context api

不过直觉上这种性能没多大差别吧，写法麻烦了。你可以先测试一下看看。

因为参数变化才需要重新定义，那利用一下 event 对象吧。

const handleClick= (e)=>{
const item = category.find(x=>x.id ===e.target.dataset.id)；
}

category.map(item=>{
return (<div data-id={item.id} onClick={handleClick} />)
})

@byte10 经典 你觉得不好 是你不够“高级”。

@byte10 经典把 mac 硬件和 win 软件混为一谈。。。

确实，没买 mac 电脑的，没用 4k 的都该 kill 掉。

@919615766 是的，发布就一直在用。你看 readme 可以知道这个库就是对 react context api 的简单封装，没有多少更新维护的需求了。

代码也就 40 行，真有啥问题 fork 一下自己改

redux 算是第一代状态管理了吧，这个真不行，开始我宁愿挂到 window 里我都不愿用这个。
第二代是 mobx，这个集中管理，用了一段时间，就是使用还要注入，缺少类型提示，勉强用着。
第三代 react16 推出了 hook，就有了这个 https://www.npmjs.com/package/unstated-next 。可以说已经完美了。

没有 TS ？？没有 TS ？？没有 TS ？？

@zhengfan2016 可以设置成中文。。

@deanguqiang 跑个题，我的真好奇，开着这么多窗口真的有效率吗。
你的工作场景是怎么样？阅历太浅想象不出。
有些标签会不会放在哪几个小时都不会切过去看啊？

1 、上下游都需要 TS 支持
不需要。在 tsconfig 中配置 allowJs:true, 你就可以直接 import 一个 js 文件。

2 、接口字段类型不固定
这个两个方案，实际例子来说有个 age 字段
一是定义成 any 类型，这样就降级到 js，你原来 js 怎么做就怎么做。比较年龄时编译器不会报错，但运行时可能就报错了(出现字符串比较 '2' 大于 '11'这种情况)。
二是定义成 unknown,这样在你比较年龄时编译器会报错，需要你先写判断 if(typeof a.age ==='number'){//TODO 比较年龄}，才能编译通过
-------
这个帖子的风向已经是人生攻击了，你作为题主很有必要拉回来。
-------
在我的理解中，js 换到 ts 不会有任何成本。除了一个领域到另一个领域的“几天学习成本”。
你可以提出你遇到问题，我们很乐意为你提供解决方案。