Question

我正在学习组件生命周期。据我所知，在创建组件时首先调用getDeafaultProps（）。我检查日志，“获取我们的默认属性”不打印出来。为什么呢？

/*
 * A simple React component
 */
class Application extends React.Component {

  getDefaultProps() {
    console.log("Getting our default properties")
  }
  componentWillMount() {
    console.log("Before Mounting")
    this.setState({count: 1});
  }


  render() {
    return <div>
      <h1>{this.state.count}</h1>

      <p>
        More info <a href="https://github.com/bradleyboy/codepen-react" target="_blank">here</a>.
      </p>
    </div>;
  }
}

/*
 * Render the above component into the div#app
 */
React.render(<Application />, document.getElementById('app'));

Answer 1

因为您使用ES6类，所以不应该调用它。请参阅documentation：

使用函数和ES6类，defaultProps被定义为组件本身的属性

使用1885193628 -622124880 -622124884 1885193628 -622124868 -622124872 1885193628 -622124856 -622124860 1885193628 -622124844 -622124848 1885193628 -622124832 -622124836 1885193628 -622124820 -622124824 1885193628 -622124808 -622124812 1885193628 -622124796 -622124800 1885193628 -622124784 -622124788 1885193628 -622124772 -622124776......etc.，您需要将createReactClass()定义为传递对象的函数

Answer 2

您需要使用defaultProps而不是getDefaultProps，因为您使用的是es6，并且您需要像这样使用它：

static defaultProps = {
    p: console.log("Getting our default properties")
}

或以这种方式在class之外定义它：

App.defaultProps = {
    p: console.log("Getting our default properties")
}

检查此示例：

＆＃13;

class Application extends React.Component {
  
  static defaultProps = {
     p: console.log("Getting our default properties")
  }
  
  componentWillMount() {
    console.log("Before Mounting")
    this.setState({count: 1});
  }


  render() {
    return <div>
      <h1>{this.state.count}</h1>

      <p>
        More info <a href="https://github.com/bradleyboy/codepen-react" target="_blank">here</a>.
      </p>
    </div>;
  }
}

ReactDOM.render(<Application />, document.getElementById('app'));

＆＃13;

<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'/>

＆＃13;

Answer 3

使getDefaultProps方法保持静态。它应该工作。

static getDefaultProps() {
    console.log("Getting our default properties")
  }

为什么不调用console.log？

3 个答案: