道具

道具是一種將資訊傳遞給 React 元件的方法，它們可以包含任何型別的函式 - 有時也稱為回撥函式。

在 JSX 中，使用屬性語法傳遞 props

<MyComponent userID={123} />

在 MyComponent 的定義中，現在可以從 props 物件訪問 userID

// The render function inside MyComponent
render() {
    return (
        <span>The user's ID is {this.props.userID}</span>
    )
}

定義所有 props 及其型別以及適用的預設值非常重要：

// defined at the bottom of MyComponent
MyComponent.propTypes = {
    someObject: React.PropTypes.object,
    userID: React.PropTypes.number.isRequired,
    title: React.PropTypes.string
};

MyComponent.defaultProps = {
    someObject: {},
    title: 'My Default Title'
}

在這個例子中，prop someObject 是可選的，但是 prop tiuan3 是必需的。如果你未能向 MyComponent 提供 userID，則在執行時，React 引擎將顯示一個控制檯，警告你未提供所需的道具。請注意，此警告僅顯示在 React 庫的開發版本中，生產版本不會記錄任何警告。

使用 defaultProps 可以簡化

const { title = 'My Default Title' } = this.props;
console.log(title);

至

console.log(this.props.title);

它也是使用 object array 和 functions 的保障。如果你沒有為物件提供預設道具，如果未傳遞道具，則以下內容將丟擲錯誤：

if (this.props.someObject.someKey)

在上面的示例中，this.props.someObject 是 undefined，因此 someKey 的檢查將引發錯誤並且程式碼將中斷。使用 defaultProps，你可以安全地使用上述檢查。