Javascript JavaScipt：将HTML实体作为函数参数传递

是否有任何方法可以将

HTML

实体作为JavaScript中的函数参数传递

我正在构建一个React应用程序，我需要将

HTML

实体作为

prop

从父组件传递到子组件，然后在子组件中显示该实体表示的字符

例如，请参阅stackblitz

在

Hello

组件中，我需要将从App组件收到的

htmlEntity

打印为

prop

，并显示该实体表示的字符，在这种情况下，它将是symbol-“”

---

如何做到这一点？

一种方法是在react中使用

危险的西丁神经HTML

function createMarkup(str) {
  return {__html: str};
}

function MyComponent({str}) {
  return <div dangerouslySetInnerHTML={createMarkup(str)} />;
}

const myText = 'First &middot; Second';
<MyComponent str={myText} />}

函数createMarkup（str）{
返回{uuuhtml:str}；
}
函数MyComponent（{str}）{
回来
}
const myText='First·；第二",；
}

另一种方法是使用带转义符号的Unicode字符（例如.\u0057）代替HTML代码（·）

函数MyComponent（{str}）{
返回{str}；
}
常量myText='First\u0057 Second'；

一种方法是在react中使用

危险的LysetinerHTML

function createMarkup(str) {
  return {__html: str};
}

function MyComponent({str}) {
  return <div dangerouslySetInnerHTML={createMarkup(str)} />;
}

const myText = 'First &middot; Second';
<MyComponent str={myText} />}

函数createMarkup（str）{
返回{uuuhtml:str}；
}
函数MyComponent（{str}）{
回来
}
const myText='First·；第二",；
}

另一种方法是使用带转义符号的Unicode字符（例如.\u0057）代替HTML代码（·）

函数MyComponent（{str}）{
返回{str}；
}
常量myText='First\u0057 Second'；

从“React”导入React；
导入“/style.css”；
导出默认函数App（）{
常数htmlEntity=÷；；
返回(
);
}
常量Hello=（{htmlEntity}）=>(
{htmlEntity}
)

像这样实现它

从“React”导入React；
导入“/style.css”；
导出默认函数App（）{
常数htmlEntity=÷；；
返回(
);
}
常量Hello=（{htmlEntity}）=>(
{htmlEntity}
)

像这样实施

import React from "react";
import "./style.css";

export default function App() {
 const htmlEntity = <div>&#247;</div>;
 return (
  <div>
   <Hello htmlEntity={htmlEntity}/>
  </div>
 );
}

const Hello = ({htmlEntity}) => (
 <div>{htmlEntity}</div>
)