V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
devcat9
V2EX  ›  React

2022 年,推荐的 React 状态管理框架是?

  •  1
     
  •   devcat9 · 2022-03-14 12:49:52 +08:00 · 9476 次点击
    这是一个创建于 745 天前的主题,其中的信息可能已经有所发展或是发生改变。

    好久没做前端了,最近看看了 React 前端状态管理,感觉依旧很难选择。

    Redux 这类框架感觉写起来实在是太累。

    Mobx 之前很看好,但是现在似乎也没什么人气了。

    https://openbase.com/categories/js/best-react-state-management-libraries 这里提到了 xstate 和一些其他的新库,但是都感觉各有千秋吧。

    不知道大家在 2022 年更推荐什么?

    64 条回复    2022-03-15 15:46:25 +08:00
    gouflv
        1
    gouflv  
       2022-03-14 13:00:09 +08:00   ❤️ 2
    在关注 zustand 和 recoil
    CodingNaux
        2
    CodingNaux  
       2022-03-14 13:15:17 +08:00
    没做 web app,所以用的都是 context + hook
    maichael
        3
    maichael  
       2022-03-14 13:32:02 +08:00
    SWR+Recoil
    Chism
        4
    Chism  
       2022-03-14 13:32:03 +08:00
    这个跟用 class 还是 function 组件也有关吧
    me221
        5
    me221  
       2022-03-14 13:33:31 +08:00
    recoil
    dany813
        6
    dany813  
       2022-03-14 13:33:41 +08:00
    还是 redux 习惯了,加上 context
    sweetcola
        7
    sweetcola  
       2022-03-14 13:36:51 +08:00
    目前还是 Redux ,配合 reduxjs/toolkit 能减少一些代码量。

    Recoil 还是等正式版出来后才再去考虑是否能替换 Redux 。
    lokya
        8
    lokya  
       2022-03-14 13:38:13 +08:00
    看需求吧 我们现在还在用 dva 但是 纯 context 也蛮好用的,recoil 有了解过那会还没发正式版 ,就没用
    ospider
        9
    ospider  
       2022-03-14 13:54:20 +08:00
    useSWR + useReducer
    xff1874
        10
    xff1874  
       2022-03-14 13:58:10 +08:00
    jotai 吧,简单一点。
    ericgui
        11
    ericgui  
       2022-03-14 14:00:51 +08:00
    你用习惯了 redux ,其实挺好用的
    Immortal
        12
    Immortal  
       2022-03-14 14:02:05 +08:00
    在用 rematch,关注 recoil
    fengfuliu
        13
    fengfuliu  
       2022-03-14 14:04:03 +08:00
    TWorldIsNButThis
        14
    TWorldIsNButThis  
       2022-03-14 14:10:14 +08:00
    @ospider
    @maichael
    老哥们能否帮忙看下 swr 的这个问题 感谢
    https://www.v2ex.com/t/839773
    wuchangming89
        15
    wuchangming89  
       2022-03-14 14:13:45 +08:00
    一直 MobX ,双向绑定简简单单,不花里胡哨
    SolidZORO
        16
    SolidZORO  
       2022-03-14 14:17:56 +08:00 via iPhone
    jotai + react-query.
    duduaba
        17
    duduaba  
       2022-03-14 14:19:19 +08:00
    mobx 吧,语法简练易懂,主要是快。
    bnrwnjyw
        18
    bnrwnjyw  
       2022-03-14 14:31:22 +08:00
    {}
    creanme
        19
    creanme  
       2022-03-14 14:36:44 +08:00
    要不试试 jotai ?
    L1shen
        20
    L1shen  
       2022-03-14 14:39:28 +08:00
    喜欢 mobx 的也可以试试 valtio, 跟 jotai 同一个组织写的
    cloudzqy
        21
    cloudzqy  
       2022-03-14 14:45:59 +08:00
    现在写的业务都太简单了,我都是 hook 直接撸了,唉。
    dartabe
        22
    dartabe  
       2022-03-14 14:57:51 +08:00
    Redux toolkit 别整那些花里胡哨的
    WhiteHu
        23
    WhiteHu  
       2022-03-14 15:12:07 +08:00
    @maichael 正解 我们封装了一套 现在用的很爽
    liuzhaowei55
        24
    liuzhaowei55  
       2022-03-14 15:31:58 +08:00 via iPhone
    mobx react lite 加上 mobx state tree 挺好用的
    kingsleydon
        25
    kingsleydon  
       2022-03-14 15:33:11 +08:00
    react-query + jotai
    dcsuibian
        26
    dcsuibian  
       2022-03-14 15:36:10 +08:00   ❤️ 1
    师傅多了房子歪
    newbieRenew
        27
    newbieRenew  
       2022-03-14 15:37:13 +08:00
    @me221
    @maichael

    粗略看了下文档,Atom 可以写在任意组件类,优点是灵活,缺点是不是太灵活?你们使用时有约束吗
    westoy
        28
    westoy  
       2022-03-14 15:38:49 +08:00   ❤️ 1
    怎么生成一个随机字符窜?

    十几年前: 随机读取一个 perl 文件

    现在: 问拿什么做 react 的状态管理后随机抽取一个答案
    sjhhjx0122
        29
    sjhhjx0122  
       2022-03-14 15:44:08 +08:00   ❤️ 2
    其实都挺累的 jotai ,valtio ,zustand ,recoil 这些 hook 时代的新状态管理库,用各种 hook 包来包去,而且你敢信吗,前面三个还是一个组织下的,如果没有性能需求 context 直接封装一下就够用了,封装着封装着就变成了一个新的状态管理库,kpi 到手,公司也离不开你了,如果不嫌麻烦 rxjs 自己封装一下我觉得不错
    Removable
        30
    Removable  
       2022-03-14 15:46:46 +08:00   ❤️ 1
    后端选手自学 react ,用的是 recoil
    c1273082756
        31
    c1273082756  
       2022-03-14 16:03:00 +08:00
    dva?
    RogerL
        32
    RogerL  
       2022-03-14 16:08:26 +08:00
    zustand, jotai, valtio
    rioshikelong121
        33
    rioshikelong121  
       2022-03-14 16:11:40 +08:00
    我记得有个 github 仓库列出了几十个状态管理库,谁能把那个库贴出来.
    dasbn
        34
    dasbn  
       2022-03-14 16:22:37 +08:00
    rioshikelong121
        35
    rioshikelong121  
       2022-03-14 16:29:19 +08:00
    @dasbn 我记得有个内容更多的仓库.不是这个
    me221
        36
    me221  
       2022-03-14 16:32:54 +08:00
    @Removable +1, recoil 一看就会, 什么 redux mobx 一脸懵逼
    mwVYYA6
        37
    mwVYYA6  
       2022-03-14 16:36:44 +08:00
    最近试了 recoil ,可以比 context api 少写一点代码
    um1ng
        38
    um1ng  
       2022-03-14 17:18:19 +08:00
    其实 vue3 的状态管理 pinia 还是挺好用的
    f360family123
        39
    f360family123  
       2022-03-14 17:18:31 +08:00
    react-query
    charlie21
        40
    charlie21  
       2022-03-14 17:27:02 +08:00
    一般思路是 UI state 和 server cache 分开 参考 https://kentcdodds.com/blog/application-state-management-with-react
    server cache 的状态交给 react-query , UI state 直接 context 。 如果要加入额外的层 用 redux
    justin2018
        41
    justin2018  
       2022-03-14 17:33:49 +08:00
    不知道选用哪个了 随机一下 😁

    https://risingstars.js.org/2021/en#section-statemanagement
    w88975
        42
    w88975  
       2022-03-14 17:35:39 +08:00
    mobx 是我用过最纯的
    fernandoxu
        43
    fernandoxu  
       2022-03-14 17:51:37 +08:00   ❤️ 2
    zhwithsweet
        44
    zhwithsweet  
       2022-03-14 19:09:31 +08:00
    不怕麻烦的话,可以用 @vue/reactivity ,整活
    wobuhuicode
        45
    wobuhuicode  
       2022-03-14 19:53:16 +08:00
    和当年一样,用 redux
    vision1900
        46
    vision1900  
       2022-03-14 19:54:42 +08:00 via Android
    Mobx 挺好,只是 React 现在 All In 函数式编程了,两者结合就很奇怪
    Cbdy
        47
    Cbdy  
       2022-03-14 19:57:07 +08:00
    Jotai
    dany813
        48
    dany813  
       2022-03-14 19:57:27 +08:00
    @f360family123 这个是管理 http 接口的吧
    f360family123
        49
    f360family123  
       2022-03-14 20:12:17 +08:00
    @dany813 是的,但是一般应用场景下数据都是从接口拿到的。只要管理接口的数据就可以了,剩下的用 Context
    isbase
        50
    isbase  
       2022-03-14 21:18:24 +08:00
    久经考验的还是 redux + hooks ,小点的项目自己封装一些 hooks 配合 context 够用了。

    重量级项目可以上 redux ,其他的不推荐
    posebear1990
        51
    posebear1990  
       2022-03-14 21:23:41 +08:00
    贴一篇旧文: [You Might Not Need Redux]( https://medium.com/@dan_abramov/you-might-not-need-redux-be46360cf367)
    agdhole
        52
    agdhole  
       2022-03-14 21:25:37 +08:00
    Recoil 很好用
    alexmy
        53
    alexmy  
       2022-03-14 21:35:40 +08:00
    hooks + mobx ,一般习惯了就先不换了吧,前端变化那么快,真心赶不上。何况,我是做后端的。
    poplar50
        54
    poplar50  
       2022-03-14 22:44:20 +08:00 via Android
    tanstack
    shaodeyu1943
        55
    shaodeyu1943  
       2022-03-14 22:55:44 +08:00
    @ospider 老哥,看你一直安利这个。
    XTTX
        56
    XTTX  
       2022-03-14 23:45:58 +08:00
    写习惯了 dispatch reducer 的话,zustand 上手是很快的。自带的 persist localstorage 也很舒服。 再加上 immer 去改 nested object,我觉得比 redux,useContext 什么的舒服很多。
    rannnn
        57
    rannnn  
       2022-03-15 00:00:19 +08:00
    上 GraphQL 用 Apollo 或者 Relay , 剩下的情况 context 就可以搞定
    fuermosi777
        58
    fuermosi777  
       2022-03-15 05:27:44 +08:00
    前端变化好快,以前用 mobx 很顺手,时隔几年不写前端,再看已经百花齐放了。
    kensoz
        59
    kensoz  
       2022-03-15 07:47:56 +08:00
    recoil
    Torpedo
        60
    Torpedo  
       2022-03-15 09:56:46 +08:00
    redux 挺好的。可以各种自己定制
    iamvvv
        61
    iamvvv  
       2022-03-15 10:10:25 +08:00
    dva 很舒服
    yazoox
        62
    yazoox  
       2022-03-15 10:28:09 +08:00
    还是在用 redux + redux-saga
    ......
    zishaofei221
        63
    zishaofei221  
       2022-03-15 11:11:00 +08:00
    小的 hooks
    大的 concentjs
    undermoodzyx
        64
    undermoodzyx  
       2022-03-15 15:46:25 +08:00
    dva 加 model 工厂模式,嗯,好吃
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   942 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 33ms · UTC 20:56 · PVG 04:56 · LAX 13:56 · JFK 16:56
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.