React JS：瀏覽器控制台顯示“未捕獲的TypeError：type.apply不是函數”，頁面空白

Question

我是React 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'))

Answer 1

當您使用JSX時，React組件需要由帶有首字母大寫的變量引用。

查看HTML標簽與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>

React JS：瀏覽器控制台顯示“未捕獲的TypeError：type.apply不是函數”，頁面空白

問題描述

1 個解決方案

解決方案1
3 已采納 2015-05-07 15:23:49

React JS：瀏覽器控制台顯示“未捕獲的TypeError：type.apply不是函數”，頁面空白

問題描述

1 個解決方案

解決方案1 3 已采納 2015-05-07 15:23:49

解決方案1
3 已采納 2015-05-07 15:23:49