警告 文本的意外字符串串联

Question

我遇到了多个与内嵌样式背景图像相关的警告。使用React-static我没有任何问题，但是现在使用Gatsby我得到了这个错误:

警告 文本的意外字符串串联

如果我只想使用内联样式，我该如何进行编码？任何建议都有帮助。

现在我正在导入我的背景图像并使用内联样式。我宁愿导入图像并使用内联样式，而不是创建多个css样式。

代码：

import Background from '../img/background.gif';


<div id="hero" className="header-banner" style={{background: 'url(' + `${Background}` + ')'}}></div>

Answer 1

看起来你已经在评论中弄清楚了，这只是一个参考：你看到的信息来自eslint，特别是这条规则。

这个规则的目的是在两个文字可以合并成一个文字时标记它们的连接。文字可以是字符串或模板文字。

因此，您的代码是有效的，它要么是Gatsby的默认eslint设置，要么是您自己的设置对它吹毛求疵。如果你不喜欢这个规则，你可以通过设置自己的eslint设置来删除它。