Javascript 在JSX内多行中断文本

具有此组件：

import React from "react";
import { Popup } from "semantic-ui-react";

const MyComponent = () => {
  const value = "TEST";
  return (
    <Popup
      content={`This is the data: ${value}`}
      on="click"
      pinned
      trigger={<div>{value}</div>}
    />
  );
}

export default MyComponent;

---

有什么想法吗？

这似乎是个老问题

答复如下：

使用html而不是内容和

作为分隔符来解决此问题

---

尝试使用

元素而不是

\n

像内容一样尝试={

这
是数据：${value}

}。仍然不工作您可以直接传递jsx而不是字符串，这样您就可以修改您的语句

content={`This{"\n"}is the data: ${value}`}
content={`This \n is the data: ${value}`}