Question

对于工具提示，我有以下代码。

<Tooltip
     portalClassName="HelpIcon"
     title="Have a question?"
     content={<div>We're hard at work building out a more robust help tool. In the meantime, check out the current {helpContent} on the wiki.</div>}
     centered
     trigger="click"
     placement="bottom"
     tooltipType="popover"
     >
     {helpIcon}
</Tooltip>

我遇到sslint错误

“我们正在努力构建更强大的帮助工具。与此同时，请查看Wiki上当前的{helpContent}。”

说“缺少文字字符串周围的JSX表达式容器（react / jsx-no-literals）”

无论如何，我可以将其转换为该div内的字符串以避免出现该错误吗？

Answer 1

let content = <div>We're hard at work building out a more robust help tool. In the meantime, check out the current {helpContent} on the wiki.</div>;

<Tooltip
     portalClassName="HelpIcon"
     title="Have a question?"
     content={content}
     centered
     trigger="click"
     placement="bottom"
     tooltipType="popover"
     >
     {helpIcon}
</Tooltip>

Answer 2

您也可以这样做：

<Tooltip
  portalClassName="HelpIcon"
  title="Have a question?"
  content={<div>{'We're hard at work building out a more robust...'}</div>}
  centered
  trigger="click"
  placement="bottom"
  tooltipType="popover"
 >
  {helpIcon}
</Tooltip>

The rule documentation

如何修复缺少的jsx表达式容器和文字字符串？

2 个答案: