[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
  )

Facebook 功能:

zhiwei. huang

zhiwei. huang