當我們想要將資料傳遞給子元件時，可以透過 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/hexschool/pen/bGvEmer)，並使用 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 | Billy.Ji | [codepen](https://codepen.io/yaj55ushydna/pen/bGQXmjz) |
| 2 | Evan | [codepen](https://codepen.io/evanz1215/pen/poQMxxo) |
| 3 | Iris | [codepen](https://codepen.io/iris831206/pen/YzRmJJe) |
| 4 | yuchih| [codepen](https://codepen.io/hijachu/pen/ExOqdrZ?editors=1010) |
| 5 | Hsien|[codepen](https://codepen.io/Hsienlu/pen/NWEQEKQ)
| 6 | 羅羅|[codepen](https://codepen.io/bjqs02/pen/BaGXqbM)
| 7 | Ann Chou|[codepen](https://codepen.io/annchou_illu/pen/abQeQWE)
| 8 | Wendy3 | [codepen](https://codepen.io/wendy03/pen/rNQXQww) |
| 9 | stevenchang421 | [Codepen](https://codepen.io/vwtrpqmm/pen/XWyvyae) |
| 10 | yi0863 | [codepen](https://codepen.io/YI0305/pen/poQMQZe) |
| 11 | LiShang | [codepen](https://codepen.io/LiShang/pen/WNYVYaG) |
| 12 | David0799 | [codepen](https://codepen.io/David0799/pen/wvQVQEK) |
| 13 | MotoRin | [codepen](https://codepen.io/sakimoto/pen/gOQVQqb) |
| 14 | ryan.chou | [codepen](https://codepen.io/csw8524/pen/qBQeQgQ) |
| 15 | SKey | [codepen](https://codepen.io/Dale-Chien/pen/gOQVQJp) |
| 16 | 黃士桓 | [codePen](https://codepen.io/shr-huan-huang/pen/BaGXvdW) |
| 17 | chichi | [codePen](https://codepen.io/chichihuang/pen/LYXwMJE) |
| 18 | LinaChen | [codePen](https://codepen.io/LinaChen/pen/eYQqxBO) |
| 19 | 金魚 | [codepen](https://codepen.io/cso-goldfish/pen/GRwVeqz) |
| 20 | Yen | [codepen](https://codepen.io/TZU-HUANG-YEN/pen/abQeMGY) |
| 21 | AYA | [codepen](https://codepen.io/NoNameNote/pen/BaGXbON) |
| 22 | Wei_Rio | [codepen](https://codepen.io/wei_wu/pen/bGQXZzp) |
| 23 | jasperlu005 | [codepen](https://codepen.io/uzzakuyr-the-reactor/pen/oNQKVRV?editors=1010) |
| 24 | NoZ | [codepen](https://codepen.io/fgfjgror/pen/OJaKqeM) |
| 25 | 汪汪 | [Codepen](https://codepen.io/hunwooooof/pen/BaGELpO) |
| 26 | 喃喃 | [Codepen](https://codepen.io/VeLario/pen/vYQoMzK?editors=0010) |
| 27 | 地球儀 | [Codepen](https://codepen.io/dayday1222/pen/BaGXEGw) |
| 28 | Amberhh | [codepen](https://codepen.io/Amberhh/pen/WNYVBOL) |
| 29 | cataska | [codepen](https://codepen.io/lovecankill/pen/OJaKYOw) |
| 30 | 王偉青 | [codepen](https://codepen.io/lovegull/pen/KKrOLGO?editors=1010) |
| 31 | 瑀君 | [codepen](https://codepen.io/yennnnn/pen/mdQNZyz) |
| 32 | ejchuang | [codepen](https://codepen.io/EJChuang/pen/dyQxBpK) |
| 33 | smalljie | [codepen](https://codepen.io/smalljie/pen/bGQXPmE) |
| 34 | HanHan | [codepen](https://codepen.io/Emma-Yang/pen/MWzNMdE) |
| 35 | JJ Wu | [codepen](https://codepen.io/jesswu/pen/abQegjG?editors=1010) |
| 36 | collinkao |[codepen](https://codepen.io/collin0825/pen/zYMggNM) |
| 37 | azami |[codepen](https://codepen.io/azami/pen/zYyOOox) |
| 38 | besspeng |[codepen](https://codepen.io/besspengcl/pen/gOZYYRv) |
| 40 | jerry456789 |[codepen](https://codepen.io/aria198a/pen/ExGYYJZ?editors=1010) |
| 41 | Tian |[codepen](https://codepen.io/ccyy915/pen/rNoBBbL) |
| 42 | rainnping |[codepen](https://codepen.io/rainnping/pen/qBLWBxK) |
| 43 | Sebastain | [codepen](https://codepen.io/SebastianWei/pen/oNJvNPQ?editors=0010) |
| 44 | JoyceHsu | [codepen](https://codepen.io/HSUCHIASHIH/pen/NWeKWON?editors=1010) |
| 45 | Liam | [codepen](https://codepen.io/liamkkobe/pen/MWZgYbV?editors=1010) |
| 46 | JohnChien | [codepen](https://codepen.io/glqwazid-the-selector/pen/bGObNxo) |
| 47 | Ingrid | [codepen](https://codepen.io/ingrid-chi/pen/GRPKJov?editors=1010) |
| 48 | Sui | [codepen](https://codepen.io/suihsilan/pen/zYyOrPy?editors=0010) |
| 49 | Lulu | [codepen](https://codepen.io/Lin-Lulu/pen/xxmKVyR?editors=1010) |
| 50 | billy_ti | [Codepen](https://codepen.io/Ti-Show/pen/eYbOddr?editors=1010) |
| 51 | BalaBambe | [Codepen](https://codepen.io/bambe-chen/pen/abPomWP) |
| 52 | Kaya | [Codepen](https://codepen.io/laron9486/pen/wvQVLmB) |
| 53 | Che1z | [Codepen](https://codepen.io/Shih-Min-Hung/pen/zYyOowx) |
| 54 | Leo | [Codepen](https://codepen.io/Aruminiya/pen/oNJvzPg) |
| 55 | davidchengtw | [Codepen](https://codepen.io/davidcheng/pen/vYvBgjb) |
| 56 | shangchu | [Codepen](https://codepen.io/shangchu0412/pen/gOZYWbR) |
| 57 | Berlin | [Codepen](https://codepen.io/3qberlin/pen/BavBZyM)|
| 58 | Nikki | [Codepen](https://codepen.io/Nikki-Kang/pen/wvRweoL)|
| 59 | Johnson3669 | [Codepen](https://codepen.io/crpbugqy-the-typescripter/pen/ExGYwbV)|
| 60 | rChinnnn | [Codepen](https://codepen.io/rChinnnn/pen/gOZYjqV) |
| 61 | shcopy | [Codepen](https://codepen.io/shcopy/pen/zYMgmLB) |
| 62 | zona | [Codepen](https://codepen.io/w242920/pen/poqzOKa) |
| 63 | lingchang | [Codepen](https://codepen.io/ling-chang/pen/jOXNvdZ) |
| 64 | Aden | [Codepen](https://codepen.io/Osases/pen/JjwPeoN) |
| 65 | Daphne | [Codepen](https://codepen.io/DaphneShen/pen/qBLWLQe) |
| 66 | 變羊魔法 | [Codepen](https://codepen.io/cssf998811/pen/eYbOqjj) |
| 67 | Steve Tseng | [Codepen](https://codepen.io/hifly0921/pen/PoXoYGK) |
| 68 | 泊岸#3466 | [Codepen](https://codepen.io/qoq77416416/pen/mdadVGe?editors=1010) |
| 69 | Jasmin | [Codepen](https://codepen.io/thejasmin/pen/wvRvGPm) |
| 70 | wendy | [Codepen](https://codepen.io/siaochanwu/pen/LYMYNeN) |
| 71 | Kent | [Codepen](https://codepen.io/labkunz/pen/Vwqwjyx) |
| 72 | RJ | [Codepen](https://codepen.io/RJ-S/pen/ExGxNGV) |
| 72 | Jie016 | [Codepen](https://codepen.io/Jie-Kuo/pen/zYyYoQv) |
| 73 | Cami | [Codepen](https://codepen.io/fayevivi/pen/dywyNRd) |
| 74 | Mocha | [Codepen](https://codepen.io/MochaLee/pen/KKbKvRv) |
| 75 | 精靈 | [Codepen](https://codepen.io/vesbexih-the-bashful/pen/JjwjrqR) |
| 76 | 妤ㄦ | [Codepen](https://codepen.io/bmtuepzo-the-sans/pen/XWoWPaE) |
| 77 | Overy | [Codepen](https://codepen.io/tupbsair-the-vuer/pen/QWzWVrp?editors=1111) |
| 78 | jiun7523 | [Codepen](https://codepen.io/jiun-jiun/pen/oNJNPVr) |
| 79 | SkyWoW | [Codepen](https://codepen.io/WoW-Sky/pen/poqoxNZ) |
| 80 | Rxzan | [Codepen](https://codepen.io/Tzuru-Chen/pen/ZEVEqbM) |
| 81 | hungya | [Codepen](https://codepen.io/hungya777/pen/NWeWQGq) |
| 82 | yoyo#2678 | [Codepen](https://codepen.io/djmliogn-the-flexboxer/pen/jOXOgqr)
| 83 | Alice | [Codepen](https://codepen.io/AliceZhao/pen/VwqwoXN?editors=0010)
| 84 | Ataraxia | [Codepen](https://codepen.io/ataraxia8888/pen/qBLWpzB)
| 85 | PoWei#8484 | [Codepen](https://codepen.io/harrison-wei-lai/pen/MWZYWNj?editors=1010)
| 86 | 小明#4408 | [Codepen](https://codepen.io/ujlylmbv-the-lessful/pen/KKbwXKX?editors=1010) |
| 87 | Emily4869 | [Codepen](https://codepen.io/aptx4869Emily/pen/WNLbBqy) |
| 88 | curry | [Codepen](https://codepen.io/Ted19851223/pen/JjwdKEX?editors=1010) |
| 89 | Ken | [Codepen](https://codepen.io/Ken720053/pen/abPOppO) |
| 90 | Yiren | [Codepen](https://codepen.io/Yiren_Liou/pen/KKbpaxj) |
| 91 | Carey#1010 | [Codepen](https://codepen.io/Leo4077/pen/RwEWqvZ) |
| 92 | Owen | [Codepen](https://codepen.io/owen-dong/pen/oNJbbap?editors=1010) |
| 93 | DavidTsai | [Codepen](https://codepen.io/David-Tsai/pen/poqyvyG?editors=0010) |
| 94 | Jujube | [Codepen](https://codepen.io/tendayling/pen/QWzEbOW) |
| 95 | EdHsu | [Codepen](https://codepen.io/Ed-Hsu/pen/wvRWXEL?editors=1010) |
| 96 | Lydia | [Codepen](https://codepen.io/ling-chen-the-flexboxer/pen/rNPNdPq) |
| 97 | Rochel |[Codepen](https://codepen.io/rochelwang1205/pen/wvNXBod)|

| 0 | user | [Codepen]() |