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

React 学习曲线要比 Vue 陡峭许多呀

  •  1
     
  •   xiaohupro ·
    hubianluanma · 31 天前 · 8107 次点击

    先说一下自己的技术背景,后端程序员后来转为全栈,日常使用前端的 Vue 比较多,React 只上手过官网的教程 Demo ,目前想学习 React 技术栈这边的,一开始直接上手 Next.js 倒是也能做出东西,但是还是想系统的学习一下,好多概念都不清楚,例如各种 Hook ,以及它们正确的使用场景,有没有前端大佬给一点 React 学习路线,感谢🙏

    73 条回复    2025-02-28 23:30:10 +08:00
    justdoit123
        1
    justdoit123  
       31 天前
    React 要学习就跟着官网的教程走就可以,跟着敲代码,一遍不懂就两遍。

    React Hook 想要很“纯”,所以如果一些机制觉得神奇(或奇怪),就往这方面理解就好了。
    justdoit123
        2
    justdoit123  
       31 天前   ❤️ 1
    之后,如果你想稍微了解原理,我觉得这篇不错。https://zhuanlan.zhihu.com/p/372790745
    donaldturinglee
        3
    donaldturinglee  
       31 天前 via Android
    学好 js 或者 ts 就行了,基本上就那几个 hooks ,需要 custom hook 就去看看源码复现一下即可
    XTTX
        4
    XTTX  
       31 天前
    找几个成熟的 repo 学一下就好了 midday, supabase 。 更简单一点的时候 shadcn 自己的 demo. 看看别人怎么调用组件,怎么组合组件,怎么写页面。
    Icemaaan
        5
    Icemaaan  
       31 天前
    react hook 确实刚开始接触容易写死循环
    xiaohupro
        6
    xiaohupro  
    OP
       31 天前
    @justdoit123 感谢
    me1onsoda
        7
    me1onsoda  
       30 天前
    hook 其实常用的就三四个,其他都是性能优化之类,可用可不用
    xxxcat
        8
    xxxcat  
       30 天前
    我怎么觉得 Vue 的魔法更多些
    foolishcrab
        9
    foolishcrab  
       30 天前 via iPhone
    因为你习惯从页面的角度去看前端代码,所以 vue 你看着舒服,因为他本质上还是模版引擎。
    但是要学好 react ,一定要从 js 的角度去看 jsx ,思想转变不过来是学不好的。
    但是话说回来,2025 年真没啥必要学 react 了
    FrankAdler
        10
    FrankAdler  
       30 天前
    vue 是简单其实我更喜欢 react ,赶紧更符合后端的那种逻辑代码组织方式
    leo72638
        11
    leo72638  
       30 天前
    react 不就 js 写 html 吗,再加几个 hooks 罢了。vue 我感觉要记要背的东西太多了
    Violing
        12
    Violing  
       30 天前
    @foolishcrab 除了 react ,能打能学的也不多啊
    foolishcrab
        13
    foolishcrab  
       30 天前 via iPhone
    @Violing 非专业前端学一个框架能糊页面就够了。
    react next tailwind 这些东西有啥好学的,搞了半天整个行业最靠谱的落地还不如人手一个落地页。
    ai 直出秒了
    darkengine
        14
    darkengine  
       30 天前
    我是始终没搞懂 Redux ,只能用 useContext 拼凑一下这样子 = =#
    AsuorZ
        15
    AsuorZ  
       30 天前
    @xxxcat react 骚操作多,更灵活
    donaldturinglee
        16
    donaldturinglee  
       30 天前 via Android
    @darkengine 用别的状态管理就好了,redux 用起来太抽象了
    molvqingtai
        17
    molvqingtai  
       30 天前   ❤️ 4
    心智负担太重,下限低,上限也高,vue 就算技术再差的前端,写出的代码也没啥性能问题,因为有 Signals 模式兜底,react 就不一样了,写的时候随时要注意 render 次数,动不动 render 个几十次,当然缺点也是优点,没有 vue 的填鸭式编程,可以整更多花活
    Perry
        18
    Perry  
       30 天前 via iPhone
    现在都是 react-query + form hook + hook + context 就够用了,redux 现在基本不是刚需。
    ragnaroks
        19
    ragnaroks  
       30 天前
    就是因为 react 太灵活所以无从下手才“复杂”
    xiaohupro
        20
    xiaohupro  
    OP
       30 天前
    @foolishcrab 确实,写前端项目的时候我一直是以页面的角度去构建,所以 Vue 写着舒服,组件的使用也感觉符合直觉,想学习主要是因为感觉很多海外的技术栈都是这个,所以想看看到底相对于 Vue 有什么优点。
    xiaohupro
        21
    xiaohupro  
    OP
       30 天前
    @ragnaroks 有道理,一开始不好驾驭
    murmur
        22
    murmur  
       30 天前
    觉得 react 简单那是因为你默认 js 好学,实际上最恶心的就是 js 部分,css 现在有 AI 都不怕了
    shunia
        23
    shunia  
       30 天前
    一上手就是 next.js 这种噩梦级难度的吗?
    先试试纯客户端的 react 吧,说真的 SSR 还是挺烧脑的。。。
    xiaohupro
        24
    xiaohupro  
    OP
       30 天前
    @shunia 是的,Next.js 直接上手的话给我的感觉就是跟着教程可以做出一些东西了,但是具体里面为什么这么做,以及如果我想开发一个新的东西时候该如何构建组件的话就开始犯晕了,还是得从基础做起(如果是真想学习的话)
    darkengine
        25
    darkengine  
       30 天前
    @donaldturinglee 嗯,我在 React 14 的时候从 app 转 web 的,那时候的 Redux 一堆模版代码给我看得一愣一愣的
    jenson47
        26
    jenson47  
       30 天前
    你去看 vue 的库,很多都用都用 tsx 。vue3 也是推荐组合式。
    选项式上限太低,还有就是 typescript 支持情况
    除此之外 vue 的心智负担更重,脱离前端支持学一门模板语言
    binaryify
        27
    binaryify  
       30 天前   ❤️ 1
    @leo72638 比如呢,不是来来去去就那几个指令吗
    binaryify
        28
    binaryify  
       30 天前
    @darkengine #14 用 zustand
    66beta
        29
    66beta  
       30 天前
    不追求理解底层原理的话,差不多吧
    xiaohupro
        30
    xiaohupro  
    OP
       30 天前
    @66beta 那确实,如果只是快速的跑起来能用的话那个顺手用哪个,哈哈哈
    Jinnrry
        31
    Jinnrry  
       30 天前   ❤️ 1
    都学过。

    对于我这种 jquery 时代的人,Vue 入门简单很多,上手特别快,学习过程很平滑,每一步都是以前的东西,一看就懂。基本上就是以前的一大坨 html 、js 、css 拆分成单独的小块。

    但是 React 就不一样了,一上来,语法都不一样了。每个东西都是以前没见过的。立马感觉头大了。

    如果是最近新入门的人,没有任何基础,那我感觉其实差不多,反正基础概念都是从头学
    canvascat
        32
    canvascat  
       30 天前
    觉得 hook 心智负担大的可以试试类组件的写法😂
    1wlinesperday
        33
    1wlinesperday  
       30 天前
    现在应该不推荐类的写法了吧,

    资料就推荐 React.dev 就很够了吧
    sakura1988
        34
    sakura1988  
       30 天前   ❤️ 4
    问就是 react 心智负担小,才几个 hook 。结果最佳实践一个接一个,写个前端而已闹麻了。
    okakuyang
        35
    okakuyang  
       30 天前
    react 不要太简单,就是写 JS
    sakura1988
        36
    sakura1988  
       30 天前
    数一下现在 react 有多少个 hook 了,如果只需要用那几个常用的,其他的弄出来是摆着看的吗?和 vue 半斤八两,谁也别笑谁。
    GBdG6clg2Jy17ua5
        37
    GBdG6clg2Jy17ua5  
       30 天前
    对于后端写前端确实是 React 有点负担。不再是之前 jquery+html+css+js ,看个把小时就能上手了。
    静下心,看看文档,看个简单的管理后台前端项目,在有原始前端技术的基础上,估计要两三天才能上手。
    flyqie
        38
    flyqie  
       30 天前 via Android
    @Jinnrry #31

    完全同意,我也是 jq 时代过来的,主要写后端,偶尔也写写前端,感觉就是 vue 比 react 概念接受起来要轻多了。
    hshe
        39
    hshe  
       30 天前
    react ,纯纯的写 js ,挺好的适合后端,看看 demo 就上手了。
    ThinkCat
        40
    ThinkCat  
       30 天前
    react 除了 redux 状态管理太抽象,别的都很不错,适合后端,这种 ui=f(data) 的思想太适合后端了。换个别的状态管理,写页面就是写后端的感觉。
    skiy
        41
    skiy  
       30 天前
    感觉状态管理,不太友好。也太多了,不知道大家用哪个?
    epiloguess
        42
    epiloguess  
       29 天前   ❤️ 2
    vue 无敌,一旦理解了 proxy ,一点心智负担都没有,单纯就是框架设计的缺陷/局限/妥协,忍受这么一点点,v-model 秒一切,根本不需要你去担心各种优化,没必要去踩坑 react ,有那闲工夫多打打 cs 基础,学一两门后端语言,早点转后端,早日脱离前端苦海,受两头气。

    正儿八经的,不管是 vue 还是 react ,都是写页面,都是组件化的思想,只不过实现的方式不同,都是操作 DOM ,理解了什么时候能操作 DOM 就成功了一大半。别说什么函数式编程,什么代数效应,没什么优越感。react 的很多问题都是自己创造的,都是函数式编程,纯组件所带来,要你去解决 effect 的问题。用 vue 根本就没有这些烦恼。
    EricYuan1
        43
    EricYuan1  
       29 天前 via iPhone
    我是前端我在学后端,我感觉后端学习才陡峭😭
    8863824
        44
    8863824  
       29 天前
    有了 ai 这些都太简单了
    Betsy
        45
    Betsy  
       29 天前 via iPhone
    借楼问个 react 相关的框架,主要搞定前端页面就行,后端可能会用 go 之类的语言写。next.js 感觉前后端都包罗进去了
    laikick
        46
    laikick  
       29 天前
    @Betsy 不用啥框架吧 zustand + tanstack router + rsbuild + ui 库 + react query. 不做 ssr 基本上都能搞定
    DeWjjj
        47
    DeWjjj  
       29 天前
    学过 react 之后我觉得 vue 更好了。
    iseki
        48
    iseki  
       29 天前 via Android
    我倒是觉得 React 真很简单,前提是不上 Next.js 。但 Vue 的坑和魔法就太多了。
    React 只需要考虑 view=f(state) 就行了, 不出这个圈一点问题都没有,vue 才是真的把语法改了的那个,template 有的能写有的不能写,构建系统也变得更复杂,头大一圈。
    至于 Next.js ,我认为大多数时候应该是成本>收益的😅
    1Z3KYa0qBLvei98o
        49
    1Z3KYa0qBLvei98o  
       29 天前 via iPhone
    @murmur 调 css 🫣 那么多种实现方法,哪一种才是好的?🤔 选择恐惧症
    1Z3KYa0qBLvei98o
        50
    1Z3KYa0qBLvei98o  
       29 天前 via iPhone
    @molvqingtai 我看别人评论 go 也是,c++的心智负担也重,所以鹅厂转 go 了
    y1y1
        51
    y1y1  
       29 天前 via iPhone
    为 angular 挽尊一下下
    1Z3KYa0qBLvei98o
        52
    1Z3KYa0qBLvei98o  
       29 天前 via iPhone
    你知道当年别人怎么骂微软吗?刚学完一套又换另一套。心智负担非常重。也许 vue 按照微软学术的评价设计上有缺限,不够灵活,但是大家用脚投票的结果就是这个东西通俗易懂,易学好用,还相对不变。公司大了就是希望用框架/流程/制度在人员素质层次不齐/铁打的硬盘流水的兵的情况下保证 deliver 的稳定性,避免幺蛾子带来的社会影响然后船漏水了=》裁员。年轻的时候一个人过觉得自己特牛逼,年纪大了,手机不响,每天清闲没啥事就是幸福。还有拖家带口的事情呢?
    1Z3KYa0qBLvei98o
        53
    1Z3KYa0qBLvei98o  
       29 天前 via iPhone
    魔法多的东西能看源码的都不是事情

    反正高考筛选的就是阅读理解和应用

    就是乱起八糟各种写法看起来心烦

    我记得以前旧时代的微软 team 还要商量 code convention
    houshuu
        54
    houshuu  
       29 天前 via iPhone
    现在的 react 比 vue 简单其实,生态基本也稳定了,每个功能社区都有一个绝对领先的组件。
    国内用脚投票是 vue ,但海外基本属于 react 一家独大状态,岗位体感 react3:vue1 。前端代码生成的 AI 应用都只支持 react 也能看出来。
    jchnxu
        56
    jchnxu  
       29 天前   ❤️ 1
    @iseki 老哥的体验和我一致。。。
    linuxsuren
        57
    linuxsuren  
       29 天前
    拥抱 vue ,这里是我的接口开发测试工具 https://github.com/LinuxSuRen/api-testing
    shunia
        58
    shunia  
       29 天前
    @epiloguess #42 我差点信了你的话,跑去看了一下 vue 的最新文档,第一页进去就把我给整笑了。

    首先左手边上面上来就给我一个 toggle 的强提示,说什么 composition 模式啥啥的,属于是还不知道怎么回事,上来就灌入一个没有前提的知识点。

    然后页面内容一上来就给我整上两种编写组件的写法,就是我还没想着吃茴香豆呢就告诉我茴字有好几种写法了。关键是又告诉我说两种写法都一样的,你自己选就 ok 。既然是一个 opinionated 的框架,那就给定一个推荐用法不是更好吗?摆出来两种写法的意义是啥啊。

    两种写法吧,也没有任意一种写法支持 0 打包。说真的就这一点,当初 vue2 的文档就写的极其糟糕,以至于看完文档照做我也没有跑起来代码。好的一点是至少如今写明白了写 vue 就是要 100%使用打包器,当然需要使用打包器也不是缺点,实际生产不可能有人不打包。

    最后不管哪种写法,给 script 标签加 setup ,给 html 标签上添加魔法,让纯代码的部分有生命周期的概念但是又不明确说明是否有生命周期。这些如果还不叫心智负担,那我不懂什么叫心智负担。对比 react 的两种组件编写方式来说,react 都说的更明白。尤其是 functional component 的写法下,html ( jsx )的学习成本远远小于任何有自定义语法的模板语言。

    另外说一小点,vue 给的第一段代码,我一个长期写 typescript 的人,其实根本不理解怎么能在 template 里面正确的引用 count ,因为对一个长期相信类型系统的人来说,这里是一定会被 ts 的 language server 给报错找不到引用的。所以说 2025 年了,一个极其先进的框架,还在隐式的推崇无类型系统优先,我觉得也是一个很大的心智负担。

    最最后,关于心智负担我觉得还有一点很重要的是文档是否优秀。react 整个从概念到文档都非常清晰易懂,概念也很少,黑魔法更是几乎没有。你再去看看 angular 的文档,你就知道什么叫到处都是魔法。你再对比你推崇的 vue ,就会发现 vue 其实和 angular 是一个体系的,大面上“你这么做就行了,很简单”,实际上“这里有一个这样的语法,用来解决一个特定的情况”,但是不一会儿呢还有“这里还有一个这样的语法,用来解决下一个你可能会遇到的情况”。这一点在 solidjs 上也有体现,就是学起来让人觉得很头大,要解决一些实际的问题需要太多的细节。
    iseki
        59
    iseki  
       29 天前 via Android
    Vue 这样或者那样的小细节太多了,我不是天天写前端,记不住,也不想去记。React 就很简单,反正就那几个 use hook ,class 组件生命周期记不住就不记了,反正只有那么极特殊的情况需要用。
    yb2313
        60
    yb2313  
       29 天前
    vue 等同于多学一门简化后的模板语言, 不通用, react 是通用的
    murmur
        61
    murmur  
       29 天前
    @shunia 生命周期不是心智负担,恰恰是减少心智负担的部分,尤其对于企业开发,mount 的时候加载数据,unmount 清理定时器,比 hooks 简单多了

    然后组合和选项式,你的 react 也有类组件写法,只不过放弃了支持,你以前的特性说 legacy 就 legacy ,嗯?

    最最后,js 就是最大的心智,ts 更是心智体操,vue 用模版换来了 js 的不怎么用学习

    很多吹 react 的都把 js 这坨大屎当成必修课了
    jqtmviyu
        62
    jqtmviyu  
       29 天前
    @houshuu #54 react 的最佳实践太多. 光一个状态管理, n 多个. 还各自使用率不低. 请求库也是类似.
    houshuu
        63
    houshuu  
       29 天前
    @jqtmviyu 多确实是多,但是这两年慢慢的没有那种群雄逐鹿的感觉了。大部分功能前三,或者前一都是确定的。
    amlee
        64
    amlee  
       29 天前 via Android
    不搞 next 屁事没有,这才是烦,前后端混一起。

    状态管理用 zustand ,少用 useefect
    shakukansp
        65
    shakukansp  
       29 天前
    next.js 楼上都说是一坨屎

    但是 vue 的对标产品 nuxtjs 用起来简直爽飞
    yangth
        66
    yangth  
       29 天前
    都说 vue api 多,一写 react 全是新概念 hook ,redux 更是一坨
    yangth
        67
    yangth  
       29 天前
    说白了就是不直观,有种写完 kotlin 再写的 java 感觉,一个简单功能写一大坨废话
    leokun
        68
    leokun  
       29 天前
    ❌ map ,filter ,Provider ,memo ,dispatch …
    ✅ =
    jaylee4869
        69
    jaylee4869  
       29 天前
    React 看重 JavaScript 基本功。另外 Vue 是支持 JSX 的。
    visper
        70
    visper  
       29 天前
    react 像围棋,规则简单,一切都是 js. 但是再结合上它的 hooks 和整个函数重新执行的渲染机制,里面的对性能的担忧及函数的闭包引用,这就是心智负担的来源了。取决说你 js 能力的强弱。基本上 react 各个项目之间看代码,感觉起来相差很多。
    vue 像象棋,各种地方规则多了,开始的时候记一些生命周期啊模板语法啊,这些其实很简单半小时的事。其他的坑主要是要理解响应式原理才明白有时候什么不响应了,不过这很少遇到。而且通常做起小项目来,vue 的代码不同水平的相对 react 来说要相近一点。react 高水平的各种高阶函数各种 js 花样玩。
    lovedebug
        71
    lovedebug  
       29 天前
    @binaryify #27 类似:计算机不就是数据在寄存器 mov 来 mov 去,外加累加器计数么
    KisekiRemi
        72
    KisekiRemi  
       28 天前
    日经贴
    1Z3KYa0qBLvei98o
        73
    1Z3KYa0qBLvei98o  
       27 天前
    再多讲一句吧,比起高技术门槛搞垄断,我个人认为这种低技术门槛的工具其实让更多的人能够多赚点钱。当然这种低技术门槛也意味着做螺丝钉容易被替换。所以妄想不学习一直赚这么多钱到老是不太现实的。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2802 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 29ms · UTC 13:46 · PVG 21:46 · LAX 06:46 · JFK 09:46
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.