reactjs - JS引用最佳实践？ ES6/React——单引号、双引号、反引号？

Question

当然，所有这些都可以工作，但是哪一个是 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"
    };

Answer 1

使用 JSX 时，如果只是一个简单的字符串，最佳实践是直接使用双引号(无大括号)，或者如果将 var 插入到字符串中，则使用反引号

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

更一般的用法...

反引号是 ES6 对模板文字的介绍，实际上应该仅用于此用途，除非您想要执行多行字符串

单引号和双引号之间没有任何区别，但是根据我的经验，长期以来一直在使用单引号(由 linter 支持)，仅仅是因为它可以减少困惑的可读代码

跨项目坚持单一代码风格并通过 linting 强制执行也是一个好主意，因为它可以减少逃逸错误

这通常取决于您使用的其他语言，因为某些语言允许在其中一种语言中进行插值，或者在 Java 中，例如单引号表示 char 而不是 String

出于上述原因，我的偏好是它的值(value)......

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}`}} />