Wyczyść ReferenceError: mountNode nie jest zdefiniowany

wybacz mi, że przeszukaliśmy wszędzie i jestem nowy w reactjs i próbuję przykładów. Mam błądWyczyść ReferenceError: mountNode nie jest zdefiniowany

Uncaught ReferenceError: mountNode is not defined

Mam następujący przykład stąd http://facebook.github.io/react/tips/initial-ajax.html

i mój kod wygląda następująco

<!DOCTYPE html> 
<html> 
    <head> 
    <title><%= title %></title> 
    <link rel='stylesheet' href='/stylesheets/style.css' /> 
    <script src="//code.jquery.com/jquery-1.11.0.min.js"></script> 
    <script src="/javascripts/reactjs/react.js"></script> 
    <script src="/javascripts/reactjs/JSXTransformer.js"></script> 
    </head> 
    <body> 
    <h1><%= title %></h1> 
    <p>Welcome to <%= title %></p> 
    <div id="example"></div> 
    <script src="/javascripts/reactjs/build/helloworld.js"></script> 
    <script type="text/jsx"> 
    /** @jsx React.DOM */ 

    var UserGist = React.createClass({ 
     getInitialState: function() { 
     return { 
      username: '', 
      lastGistUrl: '' 
     }; 
     }, 

     componentDidMount: function() { 
     $.get(this.props.source, function(result) { 
      var lastGist = result[0]; 
      this.setState({ 
      username: lastGist.owner.login, 
      lastGistUrl: lastGist.html_url 
      }); 
     }.bind(this)); 
     }, 

     render: function() { 
     return (
      <div> 
      {this.state.username}last gist is 
      <a href={this.state.lastGistUrl}>here</a>. 
      </div> 
     ); 
     } 
    }); 

    React.renderComponent(<UserGist source="https://api.github.com/users/octocat/gists" />, mountNode); 


    </script> 

    </body> 
</html>

Z góry dziękuję!

Źródło

2014-05-12 Hokutosei

Musisz powiedzieć React, gdzie należy zamontować komponent <UserGist />. Prawdopodobnie chcesz wymienić mountNode z document.getElementById('example') odnieść do <div id="example"></div> element:

React.render(
    <UserGist source="https://api.github.com/users/octocat/gists" />, 
    document.getElementById('example') 
);

Źródło

2014-05-12 03:16:00

zadziałało! Dziękuję bardzo! Jestem nowy dla reactjs i wygląda interesująco .. – Hokutosei

Podczas próby tego dostałem 'React.renderComponent nie jest funkcją' jednak znalazłem, że jeśli zrobiłem' React.render' zamiast tego otrzymałem wynik, który miałem nadzieję na podziękowanie! – ak85

@ ak85 Tak, zmieniliśmy nazwę interfejsu API. Zmieniono moją odpowiedź. –

będąc akceptowane odpowiedź zrobione, chciałbym dodać jedną rzecz: Nie zapomnij podać odniesienia do libs wszystko, co potrzebne w JS sekcja nagłówka html, jeśli testujesz to z "katalogu przykładów zestawu":

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
<script src="https://npmcdn.com/[email protected]/dist/react.js"></script> 
<script src="https://npmcdn.com/[email protected]/dist/react-dom.js"></script> 
<script src="https://unpkg.com/[email protected]/babel.min.js"></script>

Źródło

2016-09-21 21:08:06

Wyczyść ReferenceError: mountNode nie jest zdefiniowany

Odpowiedz

Powiązane problemy