如何将JSX转换为String？

Question

这里JSX是scode示例:

export default class Element extends React.Component {
  render() {
    return (
      <div>
        <div className="alert alert-success">
          {this.props.langs.map((lang, i) => <span key={i} className="label label-default">{lang}</span>)}
        </div>
      </div>
    )
  }
}

如何获得这样的字符串？

<div><div className="alert alert-success">{this.props.langs.map((lang, i) => <span key={i} className="label label-default">{lang}</span>)}</div></div>

UPD:我得到了我在服务器上渲染的React组件.我希望将它们作为字符串转换为客户端的另一个模板库.

Answer 1

只是调用renderToStaticMarkup(),你应该得到React生成的静态html标记语言.

有点像这样:

import ReactDOMServer from 'react-dom/server';
import Element from './path/to/element/class';

const element = <Element />;

ReactDOMServer.renderToStaticMarkup(element)

这里有一些关于此的文档:

https://facebook.github.io/react/docs/react-dom-server.html#rendertostaticmarkup