我试图在JSX内部使用pre标记.在JSX中使用pre标记时,它根本不会格式化.为什么?为了使用pre标签,我需要做如下操作:
const someCodeIWantToFormat = "var foo = 1"
const preBlock = { __html: "<pre>" + pythonCode + "</pre>" };
return(
<div dangerouslySetInnerHTML={ preBlock } />;
)
为什么?
我试图在JSX内部使用pre标记.在JSX中使用pre标记时,它根本不会格式化.为什么?为了使用pre标签,我需要做如下操作:
const someCodeIWantToFormat = "var foo = 1"
const preBlock = { __html: "<pre>" + pythonCode + "</pre>" };
return(
<div dangerouslySetInnerHTML={ preBlock } />;
)
为什么?
Template literals允许使用多行字符串,保留前导/尾随空白和新行.
class SomeComponent extends React.Component {
render() {
return (
<pre>{`
Hello ,
World .
`}</pre>
)
}
}
class SomeComponent extends React.Component {
render() {
return (
<pre>{`
Hello ,
World .
`}</pre>
)
}
}
ReactDOM.render(
<SomeComponent />,
document.getElementById('pre')
)
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.3/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.3/react-dom.min.js"></script>
<!-- The content rendered into this tag should match the content below. -->
<div id="pre"></div>
<pre>
Hello ,
World .
</pre>