dangerouslySetInnerHTML可以保留标记名的大小写吗？
dangerouslySetInnerHTML可以保留标记名的大小写吗？
提问于 2018-12-11 03:53:25
我有以下几点：
this.props.message = '<NavLink to="/mypage">Click Me</NavLink>';我想渲染它，所以我尝试使用dangerouslySetInnerHTML
dangerouslySetInnerHTML={{ __html: this.props.message }}但它呈现的是<navlink to="/mypage">Click Me</navlink> (注意标签名称都是小写的)
这意味着现在无法识别<NavLink />组件。
有没有办法保存这个案例？
回答 1
Stack Overflow用户
发布于 2018-12-11 04:02:18
正如@Felix提到的，dangerouslySetInnerHTML是用来渲染超文本标记语言的，而不是JSX。
this.props.message = <NavLink to="/mypage">Click Me</NavLink>;
您应该能够将其呈现为：
{this.props.message}
或者，您可以使用render属性：
import React from "react";
import ReactDOM from "react-dom";
const A = ({ render, children }) => {
return <div style={{ fontSize: 40 }}>{render(children)}</div>;
};
const B = ({ name }) => {
return <div style={{ color: "red" }}>{name}</div>;
};
const App = () => {
return (
<A
render={name => {
return <B name={name} />;
}}
>
Colin
</A>
);
};
const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);CodeSandbox here.
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/53712682
复制相关文章
相似问题