React :浏览器控制台显示，"Uncaught : type.apply不是一个函数“，页面显示为空白
React :浏览器控制台显示，"Uncaught : type.apply不是一个函数“，页面显示为空白
提问于 2015-05-07 15:12:14
我对js的反应是新的，所以我在网上学习了一个教程，它会让我了解一些基本知识，而且我被困了很多次。我的问题包括手表任务，不检测变化，无限建筑，我找到了在线解决方案。但是这个问题很难解决，我第一次决定在论坛上发布我的问题。
jsx文件位于另一个文件中，该文件是使用我通过NPM下载的react工具编译的。当我打开浏览器时，上面写着
Uncaught TypeError: type.apply is not a function这一页仍然是空白的。当我检查开发人员工具中的挂载点div时，它不包含任何内容。
以下是html代码
<!DOCTYPE html>
<html lang="en">
<head>
<title>Timer</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/style.css">
<script src="js/react.js"></script>
</head>
<body>
<div id="mount-point"></div>
<script src="js/react-code.js"></script>
</body>
</html>这是我的jsx文件。
var counter = React.createClass({
incrementCount: function(){
this.setState({
count: this.state.count + 1
})
},
getInitialState: function(){
return {
count: 0
}
},
render: function(){
return (
<div class="my-component">
<h1>Count: {this.state.count} </h1>
<button type="button" onClick={this.incrementCount}>Increment </button>
</div>
);
}
});
React.renderComponent(<counter/>, document.getElementById('mount-point'))回答 1
Stack Overflow用户
回答已采纳
发布于 2015-05-07 15:23:49
当您使用JSX时，React组件需要由带有初始大写字母的变量引用。
React的JSX使用大写和小写的约定来区分本地组件类和HTML标记。
看起来，您所使用的教程是针对一个旧版本的React，因为React.renderComponent()在几个版本之前被React.render()所取代。下面是使用最新版本的工作片段：
<meta charset="UTF-8">
<script src="https://fb.me/react-0.13.2.js"></script>
<script src="https://fb.me/JSXTransformer-0.13.2.js"></script>
<div id="app"></div>
<script type="text/jsx;harmony=true">void function() { "use strict";
var Counter = React.createClass({
incrementCount() {
this.setState({
count: this.state.count + 1
})
},
getInitialState() {
return {
count: 0
}
},
render() {
return <div className="my-component">
<h1>Count: {this.state.count}</h1>
<button type="button" onClick={this.incrementCount}>Increment </button>
</div>
}
})
React.render(<Counter/>, document.getElementById('app'))
}()</script>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/30105112
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号