未捕獲的ReferenceError：數據未在規定反應

我正在學習從this book反應，但是當我試圖使這個簡單的基於傑森表數據：未捕獲的ReferenceError：數據未在規定反應

<!-- index.html --> 
<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8" /> 
    <title>React Tutorial</title> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.2.1/react.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.2.1/react-dom.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.34/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/remarkable/1.6.2/remarkable.min.js"></script> 
    </head> 
    <body> 
    <div id="content"></div> 



    <script type="text/babel"> 





var App = React.createClass({  
render: function(){ 

var data = [ 
     { "when": "2 minutes ago", "who": "Jill Dupre", 
     "description": "Created new account" 
     }, 
     { 
     "when": "1 hour ago", 
     "who": "Lose White", 
     "description": "Added fist chapter" 
     }, 
     { 
     "when": "2 hours ago", 
     "who": "Jordan Whash", 
     "description": "Created new account" 
     }]; 

var headings = ['When', 'Who', 'Description'] 



var headings = this.props.headings.map(function(heading) { 
return(<th> 
{heading} 
</th>); 
}); 

var rows = this.props.data.map(function(change) { 
return(<tr> 
<td> {change.when} </td> 
<td> {change.who} </td> 
<td> {change.description} </td> 
</tr>); 
}); 
return(<table> 
{headings} 
{rows} 
</table>); 
} 
}); 

ReactDOM.render(

    <App headings = {headings} data = {data} />, 
    document.getElementById('content') 
); 

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

我得到

Uncaught ReferenceError: data is not defined

Admitedly這是因爲我不知道應該在哪裏放置數據，但是這本書很模糊。我試圖在腳本的其他地方放置數據，但仍然出現錯誤。感謝您的幫助。

來源

2016-07-27 Karlom

將'data'和'headings'移到'App'之外，或者替代'this.props.data'和'this.props.headings'使用'data'和'headings'局部變量 –

哦，是的，那工作。感謝Alexander！ – Karlom

this.props：您的類/組件的引用屬性。在您的示例中，數據和標題在render函數中聲明，這意味着它們是正常的var聲明。您不能使用this.props來引用它們，而不是僅使用數據和標題。

來源

2016-07-27 17:54:49 Hareesh

未捕獲的ReferenceError：數據未在規定反應

回答

相關問題