单引号后的原子红色突出显示（'）

Question

如何禁用红色突出显示的特定实例。

我试过在单引号之前进入逃生，但它没有用。我确定单引号会引起红色突出显示，因为当我删除它时，它会消失。

这是代码：

import React from 'react';

const banner = () => {

  return <p>Tristan\'s first React site!</p>
};

export default banner;

Answer 1

“红色亮点”来自eslint。我不知道您使用的是哪种配置，但此警告适用于no-unescaped-entities

所以你可以使用like修复它：

<p>Tristan&apos;s first React site!</p>

或者使用其他可以找到该链接的选项。

您可以使用以下内容：

{`Tristan's first React site!`}

要么

<p>{'Tristan\'s first React site!'}</p>

要么

<p>{"Tristan\'s first React site!"}</p>

正如评论和其他答案中所建议的那样，但这可能会引起另一个警告：jsx-curly-brace-presence

Answer 2

这样的事情应该有效

import React from 'react';

const banner = () => {

  return <p>{'Tristan\'s first React site!'}</p>
};

export default banner;