React state应当存储哪些数据？非渲染用接口提交数据是否可存入？

非渲染类提交数据是否可以存在state中？ #

不推荐将这类数据存入state。
React的state更新默认会触发当前组件及所有子组件的重渲染流程，而你描述的「不在UI展示、无需触发渲染、仅做API提交用」的数据，变更时完全不需要更新UI，存入state只会产生无意义的重渲染开销，业务逻辑复杂、组件嵌套层级深的场景下很容易造成性能问题。
这类数据更适合用useRef存储：useRef的current属性支持读写任意类型数据，且修改时不会触发组件重渲染，完全匹配该场景的需求。

明确需要存入state的数据判断标准 #

满足以下任意一个条件的可变数据，才需要存入state：

• 直接在UI层渲染展示的数据：比如表单输入值、接口返回的列表内容、用户选择的筛选项等，修改后需要UI同步更新。
• 需要通过值变更触发组件副作用执行的标识位：比如加载态loading、弹窗显隐控制位isModalOpen，这类值变更时往往伴随useEffect等副作用逻辑的执行，需要state变更触发重渲染来触发对应逻辑。
• 需要在组件多次渲染间持久化、且变更需要触发UI更新的数据：如果变更不需要触发UI更新，优先用useRef存储即可。

补充实践建议：如果是跨组件共享的非渲染类提交数据，可以通过React Context结合useRef存储，避免走state导致全局关联组件的不必要重渲染。

内容的提问来源于stack exchange，提问作者Siluveru Kiran Kumar