Reagieren Tutorial Lerntyp Fehler

-1

Ich versuche zu lernen Reagieren von official tutorial. Ich erhalte den folgenden Fehler.Reagieren Tutorial Lerntyp Fehler

TypeError: Constructor Comment requires 'new' react.js:5970

Ich weiß nicht, was ich falsch mache. Mein Quellcode ist unten angegeben.

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
    <meta http-equiv="x-ua-compatible" content="ie-edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1" /> 
    <title>Hello World</title> 

    </head> 
    <body> 
     <div id="content"></div> 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.js"></script> 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.js"></script> 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script> 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js">   
     </script> 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.5/marked.min.js">  
     </script> 

     <script type="text/babel"> 
     // tutorial8.js 
     var data = [ 
       {id: 1, author: "Pete Hunt", text: "This is one comment"}, 
       {id: 2, author: "Jordan Walke", text: "This is *another* comment"} 
       ]; 

    var CommentBox = React.createClass({ 
     render: function() { 
      return (
       <div className="commentBox"> 
        <h1>Comments</h1> 
        <CommentList data={this.props.data} /> 
       </div>); 
     } 
    }); 

    var CommentList = React.createClass({ 
     render: function() { 
      var commentNodes = this.props.data.map(function(comment) { 
       return (
        <Comment author={comment.author} key={comment.id}> 
         {comment.text} 
        </Comment>); 
      }); 
      return (
       <div className="commentList"> 
        {commentNodes} 
       </div> 
      ); 
     } 
    }); 

    // Always the last step. 
    ReactDOM.render(
     <CommentBox data={data} />, 
     document.getElementById('content')); 
</script>

Quelle

2016-06-07 Kartik

seine Ursache haben Sie nicht Kommentar als eine Komponente in Ihrem Code – JordanHendrix

Die Lösung für Ihr Problem ist eigentlich ganz einfach. Alles, was Sie verpassen, ist der Code zum Erstellen der Kommentar-Komponente. Möglicherweise möchten Sie, dass es in etwa so aussieht, wie Sie Ihre Kommentar-Box eingerichtet haben.

var Comment = React.createClass({ 
    render: function() { 
     return (
      <div className="commentContainer"> 
       <div className='commentAuthor'>{this.props.author}</div> 
       <div className='commentText'>{this.props.children}</div> 
      </div>); 
    } 
});

Quelle

2016-06-07 01:11:57

Sie müssen eine für jede Komponente, die Sie Sie verwenden Reagieren Komponente machen, brauchen hier nicht ein für Comment. Wenn Sie Tutorial 4 betrachten, sehen Sie, dass sie es dort schaffen.

Jedes 'Tutorial' ist hier kein eigenständiges Beispiel.

Quelle

2016-06-07 01:04:47 JordanHendrix

Danke !! Das habe ich vermisst. Ich fing an, React einen Tag vorher zu lernen, und ich vermasselte es. – Kartik

Reagieren Tutorial Lerntyp Fehler

Antwort

Verwandte Themen