React 官方示例不能渲染

Question

<div id="example"></div>    

class HelloMessage extends React.Component {
  render() {
    return <div>Hello {this.props.name}</div>;
  }
}

ReactDOM.render(<HelloMessage name="Jane" />,document.getElementById('example'));

class HelloMessage extends React.Component {
  render() {
    return React.createElement(
      "div",
      null,
      "Hello ",
      this.props.name
    );
  }
}

ReactDOM.render(React.createElement(HelloMessage, { name: "Jane" }), document.getElementById('example'));

代码如上,使用编译后的可以,编译前的不可以

Answer 1

class

class 是es6的语法糖,不用babel转换很多浏览器识别不了

Answer 2

我是这么写的

var HelloMessage = React.createClass({
    //内部代码
});

Answer 3

目前es6和jsx都需要转换编译后才能在浏览器直接运行