tongyuelong
V2EX  ›  React

一准备重新学 react,又选择困难症了

  •  1
     
  •   tongyuelong · Apr 26, 2021 · 8639 views
    This topic created in 2022 days ago, the information mentioned may be changed or developed.

    两三年前写过 react,那时还没有 hooks 。后来一直写 Angular 了。

    这么长时间过去,对 hooks 比较好奇,想重新学一下,然后又选择困难症了,请指教一下

    1 、 现在的状态管理最普遍的是选择什么? redux 、mobx 、recoil 或者其它 ? redux 学过,感觉写起来好麻烦 ,mobx 好很多,recoil 是最近搜索知道的,没有接触过。

    2 、各种表单组件、UI 组件有什么推荐吗? 不是写管理后台的应用。

    3 、项目框架有什么最佳实践吗?因为 react 比较灵活,自己等下又整乱了。

    36 replies  •  2021-05-01 14:12:21 +08:00
    dcoder
    dcoder
    Apr 26, 2021
    1
    同问
    dartabe
    dartabe
    Apr 26, 2021
    2
    mobx 有 redux 那么好的 debug 工具吗?
    ericls
    ericls
    Apr 26, 2021
    3
    你先要知道自己需要解决什么问题 然后再去找解决方案
    xstmjh
    xstmjh
    Apr 26, 2021❤️3
    4
    1. 现在大部分的 redux 的场景都可以被 hook, react-query 覆盖了,基本不需要用到 state managment 。真的需要的话 context 和 recoil 都不错
    2. 表单:React Hook Form,UI 各花入各眼,material, ant, tailwind 都不错
    3. react 没有大一统的最佳实践,但遵循函数式编程 + Composition over Inheritance, 基本不会差的很远。选自己项目组喜欢的组织方式就好了
    Mutoo
    Mutoo
    Apr 26, 2021 via iPhone
    5
    可以用 redux toolkits,简化了很多。
    beginor
    beginor
    Apr 26, 2021 via Android
    6
    既然会 angular,状态用 rxjs 也是挺不错的
    shzx1994529
    shzx1994529
    Apr 26, 2021
    7
    @xstmjh 赞
    xinhaiw
    xinhaiw
    Apr 26, 2021
    8
    Context 代替不了 Redux
    Cbdy
    Cbdy
    Apr 26, 2021 via Android
    9
    我用 Redux
    jielong
    jielong
    Apr 26, 2021
    10
    想问一下,状态管理大家都用来存储什么数据?
    每个页面都是单独请求数据的话好像没有什么需要全局管理的,Context 设计之初就是保存 theme language 这样不怎么变化的数据。
    除非是个人项目依赖本地存储,需要在多个页面处理同个数据的时候我才能想到用状态管理。
    guoliim
    guoliim
    Apr 26, 2021
    11
    react-query & xstate
    Loserzhu
    Loserzhu
    Apr 26, 2021
    12
    同 react-query + hook 。基本上覆盖了异步数据的管理。
    Ansen
    Ansen
    Apr 26, 2021
    13
    不看你说,我都忘记 React 怎么写了
    jchencode
    jchencode
    Apr 26, 2021
    14
    推荐 Mobx,我司现在用起来非常爽。
    grewer
    grewer
    Apr 26, 2021
    15
    1. 状态用 redux 还行, 不过论简洁易用确实是 mobx
    2. 表单, 若果是 hooks 我推荐使用 react-hook-form, ui 组件我只用过 antd
    3. 最佳还是需要看框架的搭配的, 就像 1,2 里面不一样, 就会有很多代码不一样, 最好自己摸索下, 但是也可以参考 github 上的
    meloncc
    meloncc
    Apr 26, 2021
    16
    建议阿里 umi 一套
    ch2
    ch2
    Apr 26, 2021
    17
    mobx 是最简单的,umi 太麻烦了
    magichacker
    magichacker
    Apr 26, 2021
    18
    直接 Umi+dva 一把梭,短平快
    liminghui168
    liminghui168
    Apr 26, 2021
    19
    直接 umi + dva + antd + ts
    namelosw
    namelosw
    Apr 26, 2021
    20
    用过 ng 直接推荐 mobx
    drinkjs
    drinkjs
    Apr 26, 2021
    21
    纯 redux,dva,mobx 都用过,个人感觉 mobx 更好用,redux 获取数据:dispatch({type:"User/getList"}), mobx 获取数据:userStore.getList(),原生的 redux 极度难用,所以有了 dva 封了一层,那怕封了一层也没 mobx 用的方便,一堆 call,put,select 烦死
    forsigner
    forsigner
    Apr 26, 2021
    22
    上面很多推荐 react-query 管理异步数据,很赞同这个,我们团队很早就这么干了,很爽,不过我们内部很早自研了类似的东西,至于状态管理,如果用了类似 react-query 的东西,需要额外的处理的状态就很少了,不建议再用 redux 、mobx 、recoil 等复杂的方案,可以使用类似这样简单的方案: https://github.com/forsigner/stook
    forsigner
    forsigner
    Apr 26, 2021
    23
    至于怎么写样式,当然强烈建议使用: https://fower.vercel.app/
    anjianshi
    anjianshi
    Apr 26, 2021
    24
    其实哪个都行。mobx 、redux 、rxjs 都能实现一样的功能。mobx 用起来简单点,可以先用这个上手
    lokya
    lokya
    Apr 26, 2021
    25
    mobx redux 推荐都掌握以下,hooks 推荐学习
    catcn
    catcn
    Apr 26, 2021
    26
    懒得学这么多,直接撸了 ant.design, antpro 那套太繁琐了。
    现在就是 ant.design 的皮,获取数据 axios,直接 React setState,怎么简单怎么搞。
    JerryY
    JerryY
    Apr 26, 2021
    27
    试一下 @vue/reactivity [狗头
    whincwu
    whincwu
    Apr 26, 2021 via Android
    28
    1. 状态管理从生态和周边工具角度,redux 依然是主流,原生写起来麻烦,可以试试 redux-toolkit 、remacth 、dva 等基于 redux 的二次封装
    2. UI 这块如果是 PC 端推荐 antd,移动端最近两年未关注,如果是多端推荐 material-design
    3. 框架上,我一般是脚手架 creat-react-app 加自己处理,更高层次的封装可以试试 umi 这类
    waltcow
    waltcow
    Apr 26, 2021
    30
    1. react-query + context-api
    2. antd
    3. antd-pro
    waltcow
    waltcow
    Apr 26, 2021
    31
    获取数据 axios,后端如果用的 swagger 的话,
    可以用 openapi-generator, 生成 ts 类型,和 axios 请求的代码
    https://github.com/OpenAPITools/openapi-generator/blob/master/docs/generators/typescript-axios.md
    huijiewei
    huijiewei
    Apr 26, 2021
    32
    react hooks + context + swr + axios + react-router + chakra-ui + react-hook+form

    https://github.com/huijiewei/agile-react

    基本可以搞定所有

    就是很多组件要自己慢慢写

    PS: props 的 API 设计真的需要打磨
    anoninz
    anoninz
    Apr 27, 2021
    33
    来试试 mobx-state-tree + normalizr
    tousfun
    tousfun
    Apr 27, 2021
    34
    @forsigner 大佬在哪个公司?
    forsigner
    forsigner
    Apr 27, 2021
    35
    @919615766 养老公司,金山
    kasper4649
    kasper4649
    May 1, 2021
    36
    React 生态特点就是百花齐放,想用啥就用啥。
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   1241 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 78ms · UTC 15:50 · PVG 23:50 · LAX 07:50 · JFK 10:50
    ♥ Do have faith in what you're doing.