JSX/TSX的规则
💡
原文英文，约400词，阅读约需2分钟。
📝
内容提要
JSX和TSX是现代网页开发中构建用户界面的重要工具，允许在JavaScript和TypeScript中使用类似HTML的语法。关键规则包括：每个组件返回单一根元素、使用大括号嵌入JavaScript表达式、属性名采用驼峰命名法、支持自闭合标签、特定注释语法、条件渲染及为列表提供唯一key属性。这些规则有助于编写清晰高效的代码。
🎯
关键要点
- JSX和TSX是现代网页开发中构建用户界面的重要工具，特别是在使用React时。
- 每个组件必须返回单一根元素，多个元素需要用父元素包裹。
- 可以使用大括号{}嵌入JavaScript表达式，以动态渲染值、调用函数和进行计算。
- 属性名应采用驼峰命名法，例如class变为className。
- 如果元素没有子元素，可以使用自闭合标签，需包含关闭斜杠。
- 注释语法与常规JavaScript略有不同，需用大括号包裹并使用标准注释语法。
- 支持条件渲染，可以使用三元运算符或逻辑&&来根据条件渲染元素。
- 渲染列表时，必须为每个元素提供唯一的key属性，以帮助React识别变化，提高性能。
➡️
