Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Day16. UI 實戰篇：Combo Box

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for Kalan Kalan
September 25, 2020
Programming
250
0

Day16. UI 實戰篇：Combo Box

第 12 屆 IT 鐵人賽影片教學 — 30 天從 0 到 1 學 Svelte

Avatar for Kalan

Kalan

September 25, 2020

More Decks by Kalan

See All by Kalan
單頁式應用中的無障礙設計
Avatar for Kalan kjj6198
0
830
選擇 Svelte 的三個理由 - JSDC
Avatar for Kalan kjj6198
0
410
Svelte - 如何在前端框架中脫穎而出 | ModernWeb'21
Avatar for Kalan kjj6198
0
230
状態管理を楽にする道
Avatar for Kalan kjj6198
1
440
Day25. 如何解析 HTML 語法
Avatar for Kalan kjj6198
0
190
Day24. Svelte 如何編譯程式碼（2）
Avatar for Kalan kjj6198
0
230
Svelte 如何編譯程式碼（1）
Avatar for Kalan kjj6198
0
250
Day22. Svelte 經驗談
Avatar for Kalan kjj6198
0
220
Day18. UI 實戰篇 - 圖片檢視器
Avatar for Kalan kjj6198
0
210

Other Decks in Programming

See All in Programming
Haskell/Servantを通してWebミドルウェアを捉え直す
Avatar for pizzacat83 pizzacat83
1
580
ルールを書いて終わらせないハーネスエンジニアリング
Avatar for Yuji Yamaguchi yug1224
2
1.5k
PHP Application における Kubernetes 内 gRPC 通信
Avatar for Shin Ohno ganchiku
0
440
作るコストが小さくなった時代 幸せに働くために改めて考えたいこと 〜エンジニアとして価値を出し続けるために注視している二分野〜
Avatar for YuppeEng yuppeeng
0
100
霧の中の代数的エフェクト
Avatar for funnycat funnyycat
1
390
吝嗇家のためのAI活用 / AI development for miser - ChatGPT + Issue Driven Development
Avatar for philomagi tooppoo
0
190
エンジニアにデザインハーネスを 〜デザインプロセスを規定するためのハーネス〜 / Design harness from an engineer's perspective
Avatar for r-kagaya rkaga
2
1.5k
AI 輔助遺留系統現代化的經驗分享
Avatar for James Wang jame2408
1
1.2k
Performance Engineering for Everyone
Avatar for Elena Tanasoiu elenatanasoiu
0
270
自作OSでスライド発表する
Avatar for uyuki uyuki234
1
3.8k
なぜ型を書くのか？ TSKaigi2026で改めて考える #tskaigi_smarthr
Avatar for Takuma Kajikawa kajitack
0
370
Snowflake Summitでの新機能 CoCo / CoWork / snowflake-summit-2026-overall-what-new-coco
Avatar for Tatsuhiro tatsuhiro
1
230

Featured

See All Featured
Tips & Tricks on How to Get Your First Job In Tech
Avatar for Honza Javorek honzajavorek
1
590
Faster Mobile Websites
Avatar for Dean Hume deanohume
310
32k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
666
130k
Distributed Sagas: A Protocol for Coordinating Microservices
Avatar for Caitie McCaffrey caitiem20
333
23k
Documentation Writing (for coders)
Avatar for Carmen Chung carmenintech
77
5.4k
Conquering PDFs: document understanding beyond plain text
Avatar for Ines Montani inesmontani
PRO
4
2.9k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
35
3.6k
How to Think Like a Performance Engineer
Avatar for Harry Roberts csswizardry
28
2.7k
Agile Leadership in an Agile Organization
Avatar for Dr. Kim W Petersen kimpetersen
PRO
0
190
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
183
10k
The Psychology of Web Performance [Beyond Tellerrand 2023]
Avatar for Tammy Everts tammyeverts
49
3.5k
Hiding What from Whom? A Critical Review of the History of Programming languages for Music
Avatar for Tomoya Matsuura tomoyanonymous
3
970

Transcript

  1. 第 12 屆 IT 鐵⼈賽 30 天從 0 到 1

    學 Svelte Day16 - UI 實戰篇：下拉式組合⽅塊 Combo Box

  2. 第 12 屆 IT 鐵⼈賽 應⽤情景 使⽤者選擇清單中的某⼀項，並提供搜尋功能

  3. 第 12 屆 IT 鐵⼈賽 功能 可以輸入部分⽂字作匹配 可點擊下拉選單選項改變輸入值 text 選項

    1 選項 2 選項 3 選項 4 選項 5

  4. 第 12 屆 IT 鐵⼈賽 進階功能 使⽤者可以⽤鍵盤操作選項 按下 Enter 後確認選項

    按下 ESC 後關閉選單 Accessibility 的⽀援 combobox, listbox