잡히지 않은 타입 오류 : null의 'todos'속성을 읽을 수 없습니다.

-1

저는 아주 초보자입니다. 자습서를하고 있는데, 찾을 수없는 오류가 있습니다. 강사와 일치하는 코드를 통과했지만 단순히 오류를 찾을 수 없습니다.잡히지 않은 타입 오류 : null의 'todos'속성을 읽을 수 없습니다.

embedded:29 Uncaught TypeError: Cannot read property 'todos' of null.

페이지를 검사 할 때 다음 블록에 ')'이라는 문구가 있습니다. 마지막 괄호로

<html> 
    <head> 
    <title>REACT IS FUN</title> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
     <script src="react-15.1.0.js"></script> 
     <script src="/react-dom-15.1.0.js"></script> 
     <script src="cdnjs.cloudflare.com/ajax/libs/babel- core/5.8.23/browser.min.js"></script> 
    </head> 

    <body> 
    <div class="container"> 
     <div class="row"> 
     <div class="col-md-12"> 
      <div id="app"></div> 
     </div> 
     </div> 
    </div> 


     <script type="text/babel"> 
    var App = React.createClass({ 
      GetInitialSate: function(){ 
       return{ 
       text: '', 
       todos: [ 
        { 
        id: 1, 
        name: 'Meeting at Work' 
        }, 
        { 
        id: 2, 
        name: 'Eat Lunch with babe' 
        }, 
        { 
        id: 3, 
        name: 'Tap that' 
        } 
       ] 
       } 
      }, 

     render: function(){ 
     return(
      <div> 
      <TodoForm /> 
      <TodoList todos={this.state.todos} /> 
      </div> 
     ) 
     } 
    }); 


    var TodoForm = React.createClass({ 
    render: function(){ 
     return(
     <div> 
      TODOFORM 
     </div> 
    ) 
    } 
    }); 

var TodoList = React.createClass({ 
    render: function(){ 
    return(
     <ul> 
     { 
     this.props.todos.map(todo => { 
      return <li todo={todo} key={todo.id}>{todo.name}</li> 
     }) 
     } 
     </ul> 
    ) 
    } 
}); 

     ReactDOM.render(
      <App />, 
      document.getElementById('app') 
     ); 

     </script> 
     </body> 
    </html>

출처

2016-06-15 Emil Rasborg Paulsen

s/GetInitialState/getInitialState/ –

작은 오류가 사용자의 실수 일 수 있습니다. GetInitialState()을 사용하여 상태 변수를 초기화했습니다. 그것은 당신을 위해 getInitialState()

<html> 
    <head> 
    <title>REACT IS FUN</title> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
     <script src="react-15.1.0.js"></script> 
     <script src="/react-dom-15.1.0.js"></script> 
     <script src="cdnjs.cloudflare.com/ajax/libs/babel- core/5.8.23/browser.min.js"></script> 
    </head> 

    <body> 
    <div class="container"> 
     <div class="row"> 
     <div class="col-md-12"> 
      <div id="app"></div> 
     </div> 
     </div> 
    </div> 
    <script type="text/babel"> 
var App = React.createClass({ 
     getInitialState: function(){ 
      return{ 
      text: '', 
      todos: [ 
       { 
       id: 1, 
       name: 'Meeting at Work' 
       }, 
       { 
       id: 2, 
       name: 'Eat Lunch with babe' 
       }, 
       { 
       id: 3, 
       name: 'Tap that' 
       } 
      ] 
      } 
     }, 

    render: function(){ 
    return(
     <div> 
     <TodoForm /> 
     <TodoList todos={this.state.todos} /> 
     </div> 
    ) 
    } 
}); 




var TodoForm = React.createClass({ 
    render: function(){ 
     return(
     <div> 
      TODOFORM 
     </div> 
    ) 
    } 
    }); 

var TodoList = React.createClass({ 
    render: function(){ 
    return(
     <ul> 
     { 
     this.props.todos.map(todo => { 
      return <li todo={todo} key={todo.id}>{todo.name}</li> 
     }) 
     } 
     </ul> 
    ) 
    } 
}); 

    ReactDOM.render(
     <App />, 
     document.getElementById('app') 
    ); 

    </script> 
    </body> 
</html>

JSFIDDLE:

를 작동해야해야한다.

출처

2016-06-16 07:01:19

@Emil 내 대답이 문제를 해결 했습니까? –

잡히지 않은 타입 오류 : null의 'todos'속성을 읽을 수 없습니다.

답변

관련 문제