我正在尝试使用以下 JSX 代码段传递一个 Handlebars 模板以作为 this.props.children
进行处理:
<MyComponent>
My address is {{address}}.
</MyComponent>
结果是Uncaught ReferenceError: address is not defined
。
解决方法是使用类似的东西:
<MyComponent>
<span content="My address is {{address}}."></span>
</MyComponent>
然后使用this.props.children.props.content
。这是我发现从根本上避免 {{address}}
被 JSX 解释为插值的唯一方法。
有没有直接的方法来转义 JSX 中的花括号?
最佳答案
尝试将组件内容包裹在花括号中:
<MyComponent>
{"My address is {{address}}."}
</MyComponent>
大括号中的所有内容将是一个表达式,不会被解析为 JSX。至少,它适用于 Babel REPL
关于javascript - 转义 props.children 中的大括号,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32363706/