使用Underscore和ReactJS

时间:2016-04-27 09:57:11

标签: javascript jquery reactjs

我在让Underscore使用ReactJS时遇到问题。运行ReactJS类时出现以下错误:

SCROLL_STATE_SETTLING

的index.html

Uncaught ReferenceError: _ is not defined

main.js

<html>
  <head>
  <meta http-equiv="X-UA-Compatible" content="IE=9">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-dom.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 src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>    
  </head>
  <body>
    <div id="content"></div>
    <script type="text/babel" src="scripts/main.js"></script>
  </body>
</html>

错误非常明显,它根本不明白_符号是什么。我的问题是即使我已经在var MyBox = React.createClass({ render: function(){ console.log(_.difference([1,2,3], [2,4,6,7])); } }); ReactDOM.render( <MyBox />, document.getElementById('content') ); 文件中导入了下划线库,为什么我仍然会收到此错误?是否可以在ReactJS中使用下划线?我认为它应该工作,因为jQuery也在那里工作,我没有必要定义jQuery的index.html才能使用它。我只是导入了jQuery库,它立即起作用。

感谢所有帮助。

1 个答案:

答案 0 :(得分:1)

我的猜测是在加载Underscore之前你的main.js会被执行。

尝试将Underscore include移动到脚本列表的顶部:

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-dom.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 src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script>