chore(i18n,curriculum): update translations (#43881)
This commit is contained in:
@@ -8,7 +8,7 @@ dashedName: set-state-with-this-setstate
|
||||
|
||||
# --description--
|
||||
|
||||
前面的挑戰涵蓋了組件的 `state` 以及如何在 `constructor` 中初始化 state。 還有一種方法可以更改組件的 `state`, React 提供了 `setState` 方法來更新組件的 `state`。 在組件類中調用 `setState` 方法如下所示:`this.setState()`,傳入鍵值對的對象, 其中鍵是 state 屬性,值是更新後的 state 數據。 例如,如果我們在 state 中存儲 `username`,並想要更新它,代碼如下所示:
|
||||
前面的挑戰涵蓋了組件的 `state` 以及如何在 `constructor` 中初始化 state。 還有一種方法可以更改組件的 `state`。 React 提供了 `setState` 方法來更新組件的 `state`。 在組件類中調用 `setState` 方法如下所示:`this.setState()`,傳入鍵值對的對象, 其中鍵是 state 屬性,值是更新後的 state 數據。 例如,如果我們在 state 中存儲 `username`,並想要更新它,代碼如下所示:
|
||||
|
||||
```jsx
|
||||
this.setState({
|
||||
@@ -16,11 +16,11 @@ this.setState({
|
||||
});
|
||||
```
|
||||
|
||||
React 要求永遠不要直接修改 `state`,而是在 state 發生改變時始終使用 `this.setState()`。 此外,應該注意,React 可以批量處理多個 state 更新以提高性能。 這意味着通過 `setState` 方法進行的 state 更新可以是異步的。 `setState` 方法有一種替代語法可以解決異步問題, 雖然這很少用到,但是最好還是記住它! 有關詳細信息,請參閱[React 文檔](https://facebook.github.io/react/docs/state-and-lifecycle.html)。
|
||||
React 要求永遠不要直接修改 `state`,而是在 state 發生改變時始終使用 `this.setState()`。 此外,應該注意,React 可以批量處理多個 state 更新以提高性能。 這意味着通過 `setState` 方法進行的 state 更新可以是異步的。 `setState` 方法有一種替代語法可以解決異步問題, 雖然這很少用到,但是最好還是記住它! 有關詳細信息,請參閱[React 文檔](https://reactjs.org/docs/state-and-lifecycle.html#state-updates-may-be-asynchronous)。
|
||||
|
||||
# --instructions--
|
||||
|
||||
代碼編輯器中有一個 `button` 元素,它有一個 `onClick()` 處理程序。 當 `button` 在瀏覽器中接收到單擊事件時觸發此處理程序,並運行 `MyComponent` 中定義的 `handleClick` 方法。 在 `handleClick` 方法中,使用 `this.setState()` 更新組件的 `state`。 設置 `state` 中的 `name` 屬性爲字符串 `React Rocks!`。
|
||||
代碼編輯器中有一個 `button` 元素,它有一個 `onClick()` handler。 當 `button` 在瀏覽器中接收到單擊事件時觸發此 handler,並運行 `MyComponent` 中定義的 `handleClick` 方法。 在 `handleClick` 方法中,使用 `this.setState()` 更新組件的 `state`。 設置 `state` 中的 `name` 屬性爲字符串 `React Rocks!`。
|
||||
|
||||
單擊按鈕查看渲染的 state 的更新。 如果不完全理解單擊處理程序代碼在此時的工作方式,請不要擔心。 在接下來的挑戰中會有講述。
|
||||
|
||||
|
@@ -16,7 +16,7 @@ React 提供了有用的類型檢查特性,以驗證組件是否接收了正
|
||||
MyComponent.propTypes = { handleClick: PropTypes.func.isRequired }
|
||||
```
|
||||
|
||||
在上面的示例中,`PropTypes.func` 部分檢查 `handleClick` 是否爲函數。 添加 `isRequired`,告訴 React `handleClick` 是該組件的必需屬性。 如果沒有那個屬性,將出現警告。 還要注意 `func` 代表 `function` 。 在 7 種 JavaScript 原語類型中, `function` 和 `boolean` (寫爲 `bool` )是唯一使用異常拼寫的兩種類型。 除了原始類型,還有其他類型可用。 例如,你可以檢查 prop 是否爲 React 元素。 請參閱[文檔](https://reactjs.org/docs/jsx-in-depth.html#specifying-the-react-element-type)以獲取所有選項。
|
||||
在上面的示例中,`PropTypes.func` 部分檢查 `handleClick` 是否爲函數。 添加 `isRequired`,告訴 React `handleClick` 是該組件的必需屬性。 如果沒有那個屬性,將出現警告。 還要注意 `func` 代表 `function` 。 在 7 種 JavaScript 原語類型中, `function` 和 `boolean` (寫爲 `bool` )是唯一使用異常拼寫的兩種類型。 除了原始類型,還有其他類型可用。 例如,你可以檢查 prop 是否爲 React 元素。 請參閱[文檔](https://reactjs.org/docs/typechecking-with-proptypes.html#proptypes)以獲取所有選項。
|
||||
|
||||
**注意:**在 React v15.5.0 中, `PropTypes` 可以從 React 中單獨引入,例如:`import PropTypes from 'prop-types';`。
|
||||
|
||||
|
Reference in New Issue
Block a user