反应不渲染 class

Question

我相信我在某个地方有一个语法区域，但我想不出来。

注意：我是 React 新手，正在使用 Sharepoint 进行开发。

我的 Js 文件：

var newt = React.createClass({
    getInitialState: function () {
        return {
            greeting: 'This is really',
            thing: 'code stuff'
        };
    },
    render: function () {
        return (
            <div id="react-newt">
                {this.state.greeting} {this.state.thing}!
            </div>
        );
    }
});

$(function () {
    if (document.getElementById('newt')) {
        React.render(
            <newt />,
            document.getElementById('newt')
        );
        console.log('newt');
    }
});

还有我的 HTML 文件：

<div id="newt"></div>

我检查了控制台，我看到了这个：

Answer 1

您必须为组件使用大写名称。 JSX 将小写字母视为内置 HTML 组件。有关详细信息，请参阅 User-Defined Components Must Be Capitalized。

var Newt = React.createClass({
    getInitialState: function () {
        return {
            greeting: 'This is really',
            thing: 'code stuff'
        };
    },
    render: function () {
        return (
            <div id="react-newt">
                {this.state.greeting} {this.state.thing}!
            </div>
        );
    }
});

$(function () {
    if (document.getElementById('newt')) {
        React.render(
            <Newt />,
            document.getElementById('newt')
        );
        console.log('newt');
    }
});

反应不渲染 class

React not rendering class

html

javascript

sharepoint

reactjs

react-jsx