您的组件名称必须以大写字母开头,因为以小写字母开头的组件会被搜索为默认DOM元素,例如
div, p, spanetc。对于您的
statisticsPage组件,情况并非如此。将其设置为大写即可。
根据文档:
当元素类型以
lowercase字母开头时,它指的是诸如或的内置组件,并导致将字符串'div'或“
span”传递给React.createElement。以大写字母开头的类型,例如,<Foo/>编译React.createElement(Foo)并对应于Javascript文件中定义或导入的组件。我们建议使用大写字母命名组件。如果确实有一个以
lowercase字母开头的组件,请在JSX中使用它之前将其分配给大写变量。
const View = () => ( <div> <h1>Reports</h1> <StatisticsPage /> </div>);var StatisticsPage = React.createClass({ getInitialState: function() { return {info: "loading ... "}; }, componentDidMount: function() { this.requestStatistics(); }, render: function() { return ( <div>info: {this.state.info}</div> ); }, requestStatistics:function(){ console.log('here'); this.setState({info:1}) console.log('works!!') } })ReactDOM.render(<View/>, document.getElementById('app'));<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script><div id="app"></div>


