当然,所有这些工作都是可行的,但是在jsx文件中ES6的最佳实践是哪一种? (忽略格式)。据我了解,模板字符串主要(唯一地?)用于描述性控制台日志记录,而不是常规用法?

<div className={`dropdown-menu dropdown-menu-media`}/>
<div className={"dropdown-menu dropdown-menu-media"}/>
<div className={'dropdown-menu dropdown-menu-media'}/>

我知道单引号和双引号之间没有功能上的区别(除非您在两个引号之间进行交替以避免转义)...但是...是另一种还是另一种更为常见,还是“完全”属于“口味”问题?即,如果您正在遍历代码,并且看到在相同的情况/用法下单引号和双引号随机变化,并且您必须使其统一,那么您将使用哪个?
const inputProps = {
      onChange: this.onChange,
      className: 'form-control',
      id: "someId",
      status: 'active',
      isOpen: "open"
    };

最佳答案

使用JSX时,最佳实践是如果只是一个简单字符串,则直接使用双引号(无花括号);如果将var插入该字符串,则使用反引号

JSX尝试模仿HTML属性,以便在初学时更易于访问,而且除此之外,我发现它在扫描代码时在JSX属性和普通字符串之间提供了清晰的视觉区别,因为它们可能是语法突出显示为相同的颜色

在一般情况下...

反引号是ES6模板文字的介绍,除非您要制作多行字符串,否则实际上仅应将反引号用于

单引号和双引号之间没有任何区别,但是根据我的经验,很长一段时间以来一直在使用单引号(由linters支持),这仅仅是因为它使困惑的可读代码更简单。

在整个项目中坚持单一代码样式并通过linting强制执行也是一个好主意,因为它可以减少转义错误

它通常取决于您使用的其他语言,因为某些语言允许以一种或另一种或Java进行插值,例如单引号表示char而不是String
出于上述原因,我偏爱这里。

const awardWinningActor = 'Nic Cage'

const oscarNight = `And the award for Best Actor goes to ${awardWinningActor}`

const winnersSpeech = `Some really long but also totally awesome amazing speech
and also possibly some screaming and a leather jacket slung into the crowd`

<NicCage oscarFor="Best Actor" says={`Here's my ${winnersSpeech}`}} />

10-05 20:52
查看更多