Question

我正在使用需要在UI中呈现的基本反应组件，但是当我尝试这样做时，我面临着下面的问题。

未捕获错误：解析错误：第37行：意外令牌} 在 http://localhost:63342/Sublime_Kishore/Tools/components/Body.jsx:37:undefined } ^

请在下面找到我的jxs文件。

var Body=React.createClass({
    render: function () {
        return(
            <div>
            <div className="header_div">
                <img src="images/newsradio.png" className="_logo" />
                    <button type="button" className="btn btn-default btn-lg login-btn">
                        <i className="fa fa-facebook fa-1.5x fbtn" styles="font-weight: bold;"></i><span>Login</span>
                    </button>
            </div>
            <div className="container_div">
            <div className="headers">
            <div className="production">Production</div>
            <div className="preprod">Pre-Production</div>
            <div className="qa">QA</div>
            <div className="dev" styles="width: 17%;">Development</div>
            </div>
            <ul className="production_block_main">
            <li className="hovicon effect-1 sub-a"><img src="images/QA_tool_b.png" styles="margin-right: 30px;" /><span styles="font-family:initial">Enterprise</span></li>
            <li className="hovicon effect-1 sub-a"><img src="images/QA_tool_b.png" styles="margin-right: 30px;" /><span styles="font-family:initial">Enterprise</span></li>
            <li className="hovicon effect-1 sub-a"><img src="images/QA_tool_b.png" styles="margin-right: 30px;" /><span styles="font-family:initial">Enterprise</span></li>
            <li className="hovicon effect-1 sub-a"><img src="images/QA_tool_b.png" styles="margin-right: 30px;" /><span styles="font-family:initial">Enterprise</span></li>
            <li className="hovicon effect-1 sub-a"><img src="images/QA_tool_b.png" styles="margin-right: 30px;" /><span styles="font-family:initial">Enterprise</span></li>
            <li className="hovicon effect-1 sub-a"><img src="images/QA_tool_b.png" styles="margin-right: 30px;" /><span styles="font-family:initial">Enterprise</span></li>
            <li className="hovicon effect-1 sub-a"><img src="images/QA_tool_b.png" styles="margin-right: 30px;" /><span styles="font-family:initial">Enterprise</span></li>
            <li className="hovicon effect-1 sub-a"><img src="images/QA_tool_b.png" styles="margin-right: 30px;" /><span styles="font-family:initial">Enterprise</span></li>
            <li className="hovicon effect-1 sub-a"><img src="images/QA_tool_b.png" styles="margin-right: 30px;" /><span styles="font-family:initial">Enterprise</span></li>
            <li className="hovicon effect-1 sub-a"><img src="images/QA_tool_b.png" styles="margin-right: 30px;" /><span styles="font-family:initial">Enterprise</span></li>
            <li className="hovicon effect-1 sub-a"><img src="images/QA_tool_b.png" styles="margin-right: 30px;" /><span styles="font-family:initial">Enterprise</span></li>
            <li className="hovicon effect-1 sub-a"><img src="images/QA_tool_b.png" styles="margin-right: 30px;" /><span styles="font-family:initial">Enterprise</span></li>
            <li className="hovicon effect-1 sub-a"><img src="images/QA_tool_b.png" styles="margin-right: 30px;" /><span styles="font-family:initial">Enterprise</span></li>
            <li className="hovicon effect-1 sub-a"><img src="images/QA_tool_b.png" styles="margin-right: 30px;" /><span styles="font-family:initial">Enterprise</span></li>
            </ul>
            <div>

        );
    }  //This line is showing as error in my browser
})

Answer 1

您在</div>之前错过了</ul>，也关闭了最后</div>

     </ul>
  </div>
</div>

Example

使用React Component渲染UI时出错

1 个答案: