5xruby-vue-202308-quiz-2's Introduction

5xruby-vue-202308-quiz-2

Vue.js 課程 HW2

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

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

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

練習 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

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.

Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

TensorFlow

An Open Source Machine Learning Framework for Everyone

Django

The Web framework for perfectionists with deadlines.

Laravel

A PHP framework for web artisans

D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

web

Some thing interesting about web. New door for the world.

server

A server is a program made to process requests and deliver data to clients.

Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

Visualization

Some thing interesting about visualization, use data art

Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.

Microsoft

Open source projects and samples from Microsoft.

Google

Google ❤️ Open Source for everyone.

Alibaba

Alibaba Open Source for everyone

D3

Data-Driven Documents codes.

Tencent

China tencent open source team.

midomommy / 5xruby-vue-202308-quiz-2 Goto Github PK