V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
Cbdy
V2EX  ›  问与答

Vue.js 的 JSX 中的 class attribute 为什么用 class,而不像 React 那样用 className

  •  
  •   Cbdy · 2021-01-27 08:29:07 +08:00 via Android · 2441 次点击
    这是一个创建于 1156 天前的主题,其中的信息可能已经有所发展或是发生改变。

    React 给出的解释是 class 是 JavaScript 的保留字

    18 条回复    2021-01-28 13:24:01 +08:00
    kyuuseiryuu
        1
    kyuuseiryuu  
       2021-01-27 08:39:45 +08:00 via iPhone
    因为 react 是 HTML in js,本质上还是 js 。

    vue 是 HTML 标签的拓展。
    hackyuan
        2
    hackyuan  
       2021-01-27 09:13:35 +08:00
    这个你都自问自答了,`class 是 Javascript 的保留字`。
    而 HTML 中只是标签上的一个属性而已。
    David1119
        3
    David1119  
       2021-01-27 09:29:31 +08:00
    难道不应该反过来问吗?怎么反而成了 vue 不对了。。。。
    anguiao
        4
    anguiao  
       2021-01-27 09:30:49 +08:00
    反正都得经过 Babel 转译嘛,我觉得没差。
    hjdtl
        5
    hjdtl  
       2021-01-27 09:34:09 +08:00
    一楼正确,此贴终结
    murmur
        6
    murmur  
       2021-01-27 09:36:38 +08:00
    因为在 html 里就是 class 啊,react 才是为了偷懒啥封装都不做
    mebtte
        7
    mebtte  
       2021-01-27 10:00:04 +08:00
    别问, 问就是新的语法 新的体验
    shintendo
        8
    shintendo  
       2021-01-27 10:02:32 +08:00
    正确的问法:为什么 React 要用 className 而不是跟 HTML 一样用 class,明明 vue 的 JSX 证明了保留字不是问题
    molvqingtai
        9
    molvqingtai  
       2021-01-27 10:23:22 +08:00
    楼上正解,因为 React 团队偷懒
    yaphets666
        10
    yaphets666  
       2021-01-27 10:46:56 +08:00
    vue 的思路是尽量保证和原始 HTML,JS,CSS 一致.
    template 里头的东西称作为模板,会经过 vue-loader 的处理.写什么都可以.
    class 和原生一样,并且意义是一致的,就是添加类名,当然选择 class 更符合直觉.
    这就是 vue 更加简单,容易学习的原因.尽量做的和原生一样.
    soulmt
        11
    soulmt  
       2021-01-27 11:05:09 +08:00
    这事又没有标准答案,都是开发者基于自己的逻辑来约定的而已, 不用太过于纠结。
    robinlovemaggie
        12
    robinlovemaggie  
       2021-01-27 12:24:43 +08:00
    说到这个就要刨根究底 React 和 Vue 本质上不同之处了:
    1.React 是个库(library), 而 Vue 是个框架(Framework)
    2.状态变更(Data Mutation)不同,React 是被动式(setState)给用户自主权,Vue 是主动 re-rendering,用户无法控制渲染时机。
    seki
        13
    seki  
       2021-01-27 12:32:02 +08:00
    className 是早期时候 API 设计的决定,现在来看其实本来用 class 也是没有问题的。react 开发团队也有过更改设计的想法,虽然目前没有什么新消息。采用类 react API 的 preact 就是用的 class

    这种事情没有必要拔得太高……
    Biwood
        14
    Biwood  
       2021-01-27 13:15:07 +08:00
    先搞清楚一个概念,Vue 里面那个不是 JSX,是 template,用的是 HTML 语法。
    React 里面那个才叫 JSX,用的是 JavaScript 语法。
    html 语法里面用 class,JS 语法里面用 className,很正常。
    shintendo
        15
    shintendo  
       2021-01-27 13:23:10 +08:00
    @Biwood 先搞清楚一个概念,Vue 支持 JSX
    Biwood
        16
    Biwood  
       2021-01-27 15:22:30 +08:00
    @shintendo #15
    Vue 里面所谓的 JSX 只能算是 template 的语法糖,这跟 React 里面一切皆用 JS 写的理念不一样。
    硬要刨根问底,我觉得本质上就是 template 语法跟 JavaScript 语法的区别,毕竟 Vue 的 template 模式继承自 Angular,而 React 不是。
    shintendo
        17
    shintendo  
       2021-01-27 21:09:23 +08:00
    @Biwood template 是 render funtion 的语法糖,JSX 也是 render function 的语法糖,这一点和 React 的 JSX 并没有本质区别
    assclb
        18
    assclb  
       2021-01-28 13:24:01 +08:00
    @Biwood #17 讲的没错,vue 里面不管是 jsx 还是 template 都是 render function 的语法糖...
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   3310 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 13:20 · PVG 21:20 · LAX 06:20 · JFK 09:20
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.