---
# System prepended metadata

title: "\U0001F3C5 Day 44 - provider 跨層級通訊"
tags: [Vue 直播班 - 2022 冬季班]

---

---
tags: Vue 直播班 - 2022 冬季班
---
# 🏅 Day 44 - provider 跨層級通訊

觀看完課程影音「跨層級資料傳遞 provide」後，練習下方題目。

題目
---
操作 [這個模板](https://codepen.io/hexschool/pen/mdGdVNe)，執行以下要求 （只能操作 JS 的部分）：

> provide 跨層級通訊
> - 使用 provide 方法，將 cash（1000）傳送給 ming 元件，但不要讓 ming-mom 元件收到 cash 的值。
> - 提示一：app 為第一層、ming-mom 為第二層、ming 為第三層。
> - 提示二：請勿使用 props 、 mitt 方法
> 
> - 實際狀況如圖：
> ![](https://i.imgur.com/LcUbsax.png)


## 回報流程

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

![](https://i.imgur.com/vftL5i0.png)

<!-- 解答：  

const ming = {
  template: `<div>
    小明拿到了 {{ this.cash }} 元零用錢
  </div>`,
  inject: ['cash'],
} 
 
const app = Vue.createApp({
  data() {
    return {
      cash: 1000,
    }
  },
  provide() {
    return {
      cash: this.cash,
    }
  },
})
-->




回報區
---


|   Discord    |                    CodePen / 答案                      |
|:----------:|:-------------------------------------------------------:|
| YC#2522 | [CodePen](https://codepen.io/YCLu/pen/MWqeWGO) |
| yuyu#6310 | [CodePen](https://codepen.io/yuyu0905/pen/gOdMOdp?editors=1010) |
| Potatolee#7749 | [CodePen](https://codepen.io/potatoleee/pen/PodzodP) |
| Wendy3#5615 | [CodePen](https://codepen.io/wendy03/pen/abaZbMQ) |
|AuroraC#6539|[codepen](https://codepen.io/AuroraC/pen/xxaObKB)|
| 無名#6427 |[Codepen](https://codepen.io/Nomoney/pen/YzOybNJ)|
|薯餅#3581|[Codepen](https://codepen.io/ColdingPoTaTo/pen/KKxMwpQ)|
|威爾#1694|[CodePen](https://codepen.io/WILL_Wu/pen/QWVEwjO)|
|YI#0863|[CodePen](https://codepen.io/YI0305/pen/GRXqgRZ?editors=1011)|
|LinaChen#1796|[CodePen](https://codepen.io/LinaChen/pen/vYzKOEJ)|
|mandylai#4055|[CodePen](https://codepen.io/mandy-lai-2/pen/WNgxvGP?editors=1011)|
|泊岸#3466|[CodePen](https://codepen.io/qoq77416416/pen/JjaKdoK?editors=1010)|
|楊苡安#2752|[CodePen](https://codepen.io/yi-an-yang/pen/poObJKv)|
|冬天#5215|[CodePen](https://codepen.io/winter_/pen/JjaKday)|
|Benson#6763|[Codepen](https://codepen.io/kumashow/pen/zYJBGXw)|
|int#7518|[Codepen](https://codepen.io/intHuang/pen/yLxJYVg?editors=1011)|
|Tuhacrt#0008|[codepen](https://codepen.io/Tuhacrt/pen/GRXqpQK)|
|出事了阿伯#9923|[codepen](https://codepen.io/BradpittLai/pen/OJoXyoM?editors=1010)|
|Hilda#7085|[Codepen](https://codepen.io/vwquikad-the-vuer/pen/yLxJYdv)|
|Alex#9978|[Codepen](https://codepen.io/datsxzqg-the-selector/pen/abaZdKo)|
|masterYan#2480|[Codepen](https://codepen.io/htzwgoqt-the-looper/pen/gOdMrWK)|
| albee#9121|[Codepen](https://codepen.io/albee-chang/pen/MWqejbB?editors=1111)|
| azami#5986 |[CodePen](https://codepen.io/azami/pen/gOdMLNq)|
|圈圈#4060|[codepen](https://codepen.io/wjejfczn-the-bold/pen/WNgxjRP?editors=1011)|
Zack_P#1805|[codepen](https://codepen.io/tmzazirh-the-animator/pen/BaOzwJG?editors=1010)|
| christina#6185 |[Codepen](https://codepen.io/chrisc0210/pen/KKxMGYw)|
| hannahTW#2224 |[Codepen](https://codepen.io/hangineer/pen/QWVEJbw?editors=0010)|
| 小木馬#8760 |[Codepen](https://codepen.io/wmmtbcsd/pen/bGxezOJ)|
|jacky010080#0880|[CodePen](https://codepen.io/Yen-Jung-Chen/pen/bGxeZze?editors=1010)|
|Shuo#1596|[CodePen](https://codepen.io/chiangchungshuo/pen/KKxMjEm?editors=1010)|
|SASIMI#5099|[Codepen](https://codepen.io/sashimi1327/pen/mdGrdvN)|
|柚子 #3958|[Codepen](https://codepen.io/as6625998/pen/PodGMqw?editors=1011)|
|Amberhh#2465|[codepen](https://codepen.io/Amberhh/pen/eYLzYaK)|
|Mylène#2481|[CodePen](https://codepen.io/hamajibashi/pen/RwYgLBX)|
|Eason#7884|[CodePen](https://codepen.io/ASLEO/pen/mdzwOjw)|