當我們想要將資料傳遞給子元件時，可以透過 props 來做傳遞。元件就像是 JavaScript 的 function，它可以接收任意的參數（即稱之為「props」），props 會回傳 React element，包含 children 以及自定義的參數。舉例來說：

function Child({ name }) {
  return <p>{name}</p> 
};
function Example() {
  return (
    <div>
      <Child name="John" />
    </div>
  );
}

在這個例子中，在 Child 定義了 name 這個參數，並給予 John 這個值。因此在 Child 元件就可以從 props 中取得 name 來使用。
備註：這邊的 `{ name }` 是物件解構的寫法，這裡也可以改成

function Child(props) {
  return <p>{props.name}</p> 
};

#### 文件參考
- [Your First Component](https://react.dev/learn/your-first-component#defining-a-component)
- [Passing Props to a Component](https://react.dev/learn/passing-props-to-a-component)
- [物件解構文件參考](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment)

## 題目
請複製 （右下角 fork）這個[範例](https://codepen.io/yen-kg/pen/WNVgZYd?editors=1010)，並使用 props 將資料傳到 Child 元件中，並顯示 `Hello, EveryOne!`

## 回報流程
將答案寫在 CodePen 並複製 CodePen 連結貼至底下回報就算完成了喔!
解答位置請參考下圖（需打開程式碼的部分觀看）

<!-- 解答：

// props 練習
function Child({target}) {
  return <p>Hello, {target}!</p> 
};
function Example() {
  return (
    <div>
      <Child target="EveryOne" />
    </div>
  );
}

-->

回報區
---
| # | Discord | CodePen / 答案 |
|:---:|:-------------- |:----------------------------------------------------------------------------- |
| 1 | MY | [Codepen](https://codepen.io/ahmomoz/pen/QwLqEdL) |
| 2 | Sonia | [Codepen](https://codepen.io/YUJOU/pen/QwLrZyW?editors=1010) |
| 3 | Noy(Toad) | [Codepen](https://codepen.io/MochiCodingPen/pen/yyBjmGB?editors=1010) |
| 4 | LinaChen | [Codepen](https://codepen.io/LinaChen/pen/GgKGLOE) |
| 5 | Toung | [Codepen](https://codepen.io/Toung/pen/mybKgxw) |
| 6 |邵 |[CodePen](https://codepen.io/ukscrlno-the-typescripter/pen/WbeyWmY?editors=1010)|
| 7 |嚼勁先生 |[CodePen](https://codepen.io/James520284/pen/MYgXRdN)|
|8|Hailey|[CodePen](https://codepen.io/sxbokfja-the-flexboxer/pen/pvzKBMX?editors=1010)|
| 9 | tim | [Codepen](https://codepen.io/jskrtivy-the-animator/pen/zxOaQGq?editors=1010) |
| 10 | han | [Codepen](https://codepen.io/iamHanCheng/pen/QwLxRbP?editors=1010)|
| 11 | Aaron 謝宗佑 | [Codepen](https://codepen.io/aaron-hsieh/pen/vEBrwLd)|
| 12 | 4chan | [Codepen](https://codepen.io/ijuolaqc-the-looper/pen/VYZdOvM) |
| 13 | Satar | [Codepen](https://codepen.io/SatarKuo/pen/gbYKJwd?editors=0010) |
| 14 | Amanda | [Codepen](https://codepen.io/cym199922/pen/ogvyRqE) |
| 15 | Jasmine | [Codepen](https://codepen.io/Jasmine-Lin-the-vuer/pen/emOKqNQ) |
| 16 | ya_meow | [Codepen](https://codepen.io/gkfxzvcb-the-bashful/pen/XJrYLzq?editors=1010)|
| 17 | Nocab | [Codepen](https://codepen.io/PeihanWang/pen/gbYjYMj?editors=1011)|
| 18 | Yen | [Codepen](https://codepen.io/yuxxxlouyen/pen/bNbjWBO) |
| 19 | Johnson | [Codepen](https://codepen.io/crpbugqy-the-typescripter/pen/EaYpwrX) |
| 20 | 泊岸 | [Codepen](https://codepen.io/qoq77416416/pen/KwPBrqN?editors=1010) |
| 21 | mercury2508. | [Codepen](https://codepen.io/Mercury2508/pen/OPLwrNW) |
| 22 | 毛巾 | [Codepen](https://codepen.io/bqdcjboa-the-solid/pen/ByBPXrd?editors=0010) |
| 23 | Kaya | [Codepen](https://codepen.io/kayaribi/pen/ZYzMWxG) |
| 24 | Fabio20 | [Codepen](https://codepen.io/fabio7621/pen/mybGqWv?editors=1010) |
| 25 | Clove | [Codepen](https://codesandbox.io/p/sandbox/p7p5tc) |
| 26 | Rochel | [Codepen](https://codepen.io/rochelwang1205/pen/KwPGwMq?editors=1010) |
| 27 | Rogan | [Codepen](https://codepen.io/RoganHsu/pen/mybzzzq?editors=1010) |
| 28 | 蘑菇星星 | [Codepen](https://codepen.io/brrrieon-the-vuer/pen/xbKNvrx) |
| 29 | Ariel | [Codepen](https://codepen.io/ariel0510/pen/bNGbOOW?editors=0010) |
| 30 | yun-lin | [Codepen](https://codepen.io/yunlinhsu/pen/gbOPZez?editors=1010) |
| 31 | yaoling.liang | [Codepen](https://codepen.io/Yao-Ling-L-/pen/YPzqoZb?editors=1010) |
| 32 | 郭芙蘭 | [Codepen](https://codepen.io/flora_Kuo/pen/QwWKPBQ?editors=1010) |
| 33 | Joannehu | [Codepen](https://codepen.io/nelbabkv-the-flexboxer/pen/dPyWzJK?editors=1010) |
| 34 | KOMATSU PEI | [Codepen](https://codepen.io/Komatsu2021/pen/Byadxeb?editors=1010) |
| 35 | 姜承 | [Codepen](https://codepen.io/Troy0718/pen/wBvEggd?editors=1010) |
| 36 | jinliu214 | [Codepen](https://codepen.io/jinliu214/pen/QwwVaeg?editors=0010) |
| 37 | chris | [Codepen](https://codepen.io/chris-chen-the-selector/pen/QwboJXo?editors=1010) |
| 38 | shin_kai | [Codepen](https://codepen.io/KAI-SHIN-the-animator/pen/xbZOvEd) |

<br>

- 快速複製格式：

| 0 | user | [Codepen]() |