在ReactJS中運行多個組件時出錯

我是reactjs的新手。我正在使用多個組件來創建表單，但遇到了一個我無法解決的錯誤。我徹底搜查，但無法找到答案。請幫助在ReactJS中運行多個組件時出錯

的錯誤有以下幾種：

TypeError: erroneousLine is undefined in JSXTransformer-0.12.2.js ReferenceError: Login is not defined JSXTransformer-0.12.2.js:

login.jsx

var Login = React.createClass({ 
     render: function() { 
      return (
       <div className="container"><h2>Library</h2> 
       <form role="form" action="first.ejs"> 
       <textField/> 
       <div className="form-group"> 
        <label for="email">UserId:</label> 
        <input type="email" className="form-control" id="email" placeholder="Enter email"/> 
       </div> 
       <div className="form-group"> 
        <label for="pwd">Password:</label> 
        <input type="password" className="form-control" id="pwd" placeholder="Enter password" /> 
       </div> 
       <div className="checkbox"> 
        <label><input type="checkbox"/> Remember me</label> 
       </div> 
       <button type="submit" className="btn btn-default">Submit</button> 
       </form></div> 


      ); 
     } 
    });

text_field.jsx

var textField=React.createClass({ 
    render: function(){ 
     return (<input type="text" name="username"/>); 
    } 
});

HTML

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <title>Bootstrap Example</title> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
</head> 
<body> 
<script src="http://fb.me/react-0.12.2.js"></script> 
<script src="http://fb.me/JSXTransformer-0.12.2.js"></script> 
<script type="text/jsx" src="src/text_field.jsx"></script> 
<script type="text/jsx" src="src/login.jsx"></script> 
<script type="text/jsx"> 
React.render(<Login/>, document.body); 
</script> 

</body> 
</html>

來源

2016-02-11 Kanhai Agarwal

。在你的最後一個腳本標籤的錯字。類型應該是javascript，而不是jsx。

<script type="text/javascript"> 
React.render(<Login/>, document.body); 
</script>

來源

2016-02-14 17:25:53 LodeRunner28

另外，不要直接渲染到body標籤中。 React給出了關於渲染到身體的警告。您應該創建一個單獨的div並將其渲染爲該格式。 – LodeRunner28

在ReactJS中運行多個組件時出錯

回答

相關問題