React服务器呈现转义值

时间:2015-04-22 06:24:59

标签: reactjs

我在入口点使用了reacjs服务器渲染,我有以下代码对应默认模板:

import React from 'react/addons';

export default React.createClass({
    render() {

        return (
            <html>
                <head>
                    <title>{this.props.title}</title>
                    <meta charSet="utf-8" />
                    <meta httpEquiv="X-UA-Compatible" content="IE=edge,chrome=1" />
                    <meta name="viewport" content="width=device-width" />
                    <meta name="viewport" content="width=device-width, maximun-scale=1, initial-scale=1.0, user-scalable=no" />
                    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Roboto:400,300,700" type="text/css" />
                    <link rel="stylesheet" href="/public/css/default.min.css" />
                </head>
                <body>
                    {this.props.children}
                    <script>
                        var __api = "http://localhost:7002";
                    </script>
                    <script src="/public/js/vendor.min.js"></script>
                    {this.props.feet}
                </body>
            </html>
        );
    }
});

在浏览器中运行此部分

var __api = "http://localhost:7002";

它呈现为

<script data-reactid=".oq6es39jwg.1.1">var __api = &quot;http://localhost:7002&quot;;</script>

有人知道我错过了什么吗?

1 个答案:

答案 0 :(得分:1)

您应该使用dangerouslySetInnerHTML。有关详细信息,请查看此https://facebook.github.io/react/tips/dangerously-set-inner-html.html