[React Js] React 入門 ：組件 ( Component ) 的 屬性 ( props )

在之前的文章，[React Js] React 入門 ：建立 組件 ( Component ) 中有學到了如何建立一個 React 的 組件 (Component) 了，接著我們繼續來看組件中的 屬性 (props) :

其實 組件 ( Component ) 的 屬性 ( props ) 就只是在 React.createElement() 的方法中一個 物件 Object 的 參數而已：

React 官方文件 ： createElement()

React.createElement('型態','屬性 (Object)','子元件')

而我們設置的 屬性 其實就被建立在 組件 ( Component ) 裡，名為 props 的 物件 Object 當中

而我們只要在我們定義的 組件 ( Component ) 中，使用 this.props 就可以取得我們在 React.createElement() 輸入的 屬性 物件(Object) 了

實際範例：

  class MyList extends React.Component {
    render() {
      return React.createElement('li', null, this.props.content); //使用 this.props 取得屬性物件
    }
  }
  ReactDOM.render(
    React.createElement(MyList, {'content': 'listItems'}), //賦予屬性 object
    document.body
  )