# 🏅 5/27 (四) 每日任務 Day 24
###### tags: `Vue 直播班 - 2021 夏季班`

題目 (請將答案貼上 CodePen)
---
請操作 [這個模板](https://codepen.io/znlcgmgk/pen/rNjozqB?editors=1011) (只能操作 HTML 的部分)，使用 v-if, v-else-if 的觀念撰寫答案。
> 點擊「小明」按鈕會顯示區塊一，點擊「漂亮阿姨」按鈕會顯示區塊二。同一時間在畫面上只能顯示區塊一、區塊二其中一個。

回報流程
---
請同學依照下圖教學觀看解答、回報答案:


回報格式如下圖，請在「回報區」使用註解回報答案 (為了統計人數，請同學依序加上「報數」)


<!-- 解答
<div id="app">
<div class="container mt-3">
<button type="button" class="me-3" @click="current = '小明'">小明</button>
<button type="button" @click="current = '漂亮阿姨'">漂亮阿姨</button>
<div v-if="current === '小明'">
此區塊屬於 小明
</div>
<div v-else-if="current === '漂亮阿姨'">
此區塊屬於 漂亮阿姨
</div>
</div>
</div>
-->

回報區
---
<!--1:Alpha
Codepen:https://codepen.io/alphatero/pen/wvJqJXg
-->
<!--2:陳sam
Codepen:https://codepen.io/euldpliv/pen/qBrXrKw?editors=1011
-->
<!--3: 4組/Jasmin
Codepen:https://codepen.io/thejasmin/pen/WNpEpBX?editors=1011
-->
<!--4: 4組/LiShang
Codepen:https://codepen.io/li-shang/pen/GRWvWGo
-->

<!--5: Lina Chen
Codepen:https://codepen.io/LinaChen/pen/dyvzvay
-->

<!--6: Vic
Codepen:https://codepen.io/hsuan333/pen/BaWdWgR
-->

<!--7: 小魚
Codepen:https://codepen.io/jarvis1993/pen/yLMobyq
-->

<!--8: Tori
Codepen: https://codepen.io/hayen/pen/dyvWMbv?editors=1011
-->

<!--9: Tofu Tseng
https://codepen.io/Tofutseng/pen/JjWyNGP
每日任務回饋：
1. 為什麼可以直接在 @click 操控 data 裡面的變數？這與 this 也有關係嗎？
-->
<!--10: youting
codepen: https://codepen.io/youtingluo/pen/PopKmdQ?editors=1011
-->
<!--10: YuSung
codepen: https://codepen.io/kevin-hsu-the-encoder/pen/oNZeWaB?editors=1011
-->

<!-- 11: Alysa Chan
codepen: https://codepen.io/alysachan/pen/ExWvmGV?editors=1011
-->

<!-- 12:yijun
codepen:https://codepen.io/sandy3068/pen/ZEeJKZz?editors=1010
-->

<!-- 13: Yi Chieh
codepen: https://codepen.io/Yi-Chieh/pen/vYxJmmg
-->

<!-- 14: Yiren
codepen: https://codepen.io/Yiren_Liou/pen/XWMagrX
-->

<!-- 15: Echo Hui
codepen: https://codepen.io/echohuiecho/pen/ExWvXay?editors=1011 -->

<!-- 16: Jack
https://codepen.io/yxzzktmb/pen/KKWvqWK?editors=1010
-->

<!-- 17: harold
codepen: https://codepen.io/YuWin0805/pen/poerrPw
-->

<!-- 18: Sec
codepen: https://codepen.io/Sentiments/pen/poerrew?editors=1011
-->

<!-- 19: Larry
codepen: https://codepen.io/manpower0708/pen/jOBLLBB?editors=1111
-->

<!-- 20: peter.chen1024
codepen: https://codepen.io/JIAN-RONG/pen/jOBLLZw?editors=1011
-->

<!-- 21: Joe Kuo
codepen: https://codepen.io/alertislow/pen/GRWvMgN?editors=1000
-->

<!-- 22: Amber
codepen: https://codepen.io/amberTing/pen/KKWvXMB?editors=1011
-->

<!-- 23: Ted Kuo
codepen: https://codepen.io/TedKuo/pen/JjWyrKj
-->

<!-- 24: 阿倫
codepen: https://codepen.io/jason5125122/pen/MWpvEJZ
-->

<!-- 25：RitaHuang
https://codepen.io/Rita-Rossweisse/pen/QWpMgGe
-->

<!-- 26: Ethan
https://codepen.io/blazer030/pen/YzZxEGe
-->

<!-- 27: Wendy Li
https://codepen.io/rockayumitw/pen/dyvzJxP?editors=1010
-->

<!-- 28: Jay
codepen: https://codepen.io/jayredk/pen/WNpEMjJ?editors=1011
-->

<!-- 29: Ed Huang
codepen: https://codepen.io/yide1986/pen/NWpverx
-->

<!-- 30: Jessie Cheng
codepen: https://codepen.io/JessieMosbi/pen/ZEeXYGe
-->

<!-- 31: Erica
https://codepen.io/ericadu/pen/LYWzEMv
-->

<!-- 32: Alicia Lo
https://codepen.io/dkcyhyre/pen/BaWwomv
-->

<!-- 33: Chiang
https://codepen.io/ChiangJ/pen/gOmGrjx?editors=1010
-->

<!-- 34: Oober
https://codepen.io/xtsjrjdv/pen/jOBGVWY
-->

<!--35: jimmyFang
https://codepen.io/pohxiqqo/pen/rNyGjqM?editors=1010
-->

<!-- 36: Valerie
https://codepen.io/vicky-chang/pen/WNpZORP
-->

<!-- 37: leolee
https://codepen.io/nekorice/pen/NWpaoga
-->

<!--38: AlvinChu
https://codepen.io/wave99487chu/pen/KKWyPOG
-->

<!--39: 圈圈
https://codepen.io/wei-the-lessful/pen/YzZEZMM
-->

<!-- 40: Stacey Huang
https://codepen.io/staceyhuang/pen/rNypaOe?editors=1011
-->

<!-- 41: YOYO
https://codepen.io/lumedkle/pen/XWMVMjj?editors=1011
-->

<!-- 42: Fred Chang
https://codepen.io/fred8196/pen/YzZYrVo
-->

<!-- 43: twoz
codepen: https://codepen.io/twoz/pen/YzZeqQg?editors=1011
-->

<!-- 43: Jordan Tseng
codepen: https://codepen.io/jordan-ttc-design/pen/vYxdPLE?editors=1011
-->
<!-- 44: Izumi 泉
codepen: https://codepen.io/izumi-dev/pen/NWpByMe
-->

<!-- 45: moitw
https://codepen.io/tsuifei/pen/mdWZGMe?editors=1011
-->