Skip to content

a35506322/5xruby-vue-202303-quiz-2

 
 

Repository files navigation

quiz-02

練習 1 - uBike 表格的元件拆分

修改 views/uBikeTable/uBikeTable.vue 檔案,並完成以下功能:

  1. 將搜尋的部分拆出來變成子元件 views/uBikeTable/components/search.vue
  2. 將表格的部分拆出來變成子元件 views/uBikeTable/components/uBikeTable.vue
  3. 將分頁的部分拆出來變成子元件 views/uBikeTable/components/pagination.vue
  4. 再將它們組合起來

練習 2 - 五倍對對碰

  • 修改 views/MatchGame/MatchGame.vue
  • 點擊卡片,卡片會翻開
  • 點擊兩張不同的卡片,卡片會翻回去
  • 點擊兩張相同的卡片,卡片會消失
  • 當所有卡片都消失時,顯示「恭喜破關,再來一局?」的對話框,按下確定後重置遊戲
  • 將卡片部分獨立抽出為 Card.vue 元件
  • 成品參考: https://kuro.tw/vue-card-match-game/

Recommended IDE Setup

VSCode + Volar (and disable Vetur) + TypeScript Vue Plugin (Volar).

Customize configuration

See Vite Configuration Reference.

Project Setup

npm install

Compile and Hot-Reload for Development

npm run dev

Compile and Minify for Production

npm run build

About

Vue.js 第二週作業練習

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Vue 69.2%
  • CSS 19.7%
  • JavaScript 9.3%
  • HTML 1.8%