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

Question

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

我尝试在单引号之前输入一个转义符，但是没有用。我确信单引号会引起红色突出显示，因为当我将其删除时，它就会消失。

代码如下：

import React from 'react';

const banner = () => {

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

export default banner;

Answer 1

“红色突出显示”来自eslint。我不知道您使用的是哪种配置，但是此警告是针对no-unescaped-entities

的

因此，您可以使用以下命令对其进行修复：

<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;