重构getDefaultProps到ES6 ...我的代码出了什么问题？

Question

我有以下React.createClass，我想将它传递给一个extends React.Component：

var Rect = React.createClass({ 
     getDefaultProps: function() { 
      return { 
       width: 0, 
       height: 0, 
       x: 0, 
       y: 0 
      } 
     }, 

     render: function() { 
      return (
       <rect className="bar" 
        height={this.props.height} 
        y={this.props.y} 
        width={this.props.width} 
        x={this.props.x} 
       > 
       </rect> 
      ); 
     }, 
    }); 

我给一个镜头，但它不工作：

class Rect extends React.Component { 
    constructor(props) { 
     super(props); 
    } 
    render() { 
     return (
      <rect className="bar" 
       height={this.props.height} 
       y={this.props.y} 
       width={this.props.width} 
       x={this.props.x} 
      > 
      </rect> 
     ); 
    } 
    Rect.defaultProps = { 
      width: 0, 
      height: 0, 
      x: 0, 
      y: 0 
    } 
}; 

那么，什么是错的？

Answer 1

的defaultProps定义需要在这种情况下，外类定义的：

class Rect extends React.Component { 
    constructor(props) { 
     super(props); 
    } 
    render() { 
     return (
      <rect className="bar" 
       height={this.props.height} 
       y={this.props.y} 
       width={this.props.width} 
       x={this.props.x} 
      > 
      </rect> 
     ); 
    } 
}; 
Rect.defaultProps = { 
     width: 0, 
     height: 0, 
     x: 0, 
     y: 0 
}