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

Day16. UI 實戰篇：Combo Box

Kalan
September 25, 2020
Programming
0
170

Day16. UI 實戰篇：Combo Box

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

Kalan

September 25, 2020
Tweet

More Decks by Kalan

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

Other Decks in Programming

See All in Programming
SwiftUI移行のためのインプレッショントラッキング基盤の構築
kokihirokawa
0
170
Expoによるアプリ開発の現在地とReact Server Componentsが切り開く未来
yukukotani
1
210
Kotlinの開発でも AIをいい感じに使いたい / Making the Most of AI in Kotlin Development
kohii00
5
1.8k
Rubyと自由とAIと
yotii23
6
1.9k
ナレッジイネイブリングにAIを活用してみる ゆるSRE勉強会 #9
nealle
0
170
「個人開発マネタイズ大全」が教えてくれたこと
bani24884
1
290
生成AIで加速するテスト実装 - ロリポップ for Gamersの事例と 生成AIエディタの活用
kinosuke01
0
140
5分で理解する SOLID 原則 #phpcon_nagoya
shogogg
1
410
ML.NETで始める機械学習
ymd65536
0
240
良いコードレビューとは
danimal141
9
6.5k
PRレビューのお供にDanger
stoticdev
1
240
pylint custom ruleで始めるレビュー自動化
shogoujiie
0
160

Featured

See All Featured
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
233
17k
Designing on Purpose - Digital PM Summit 2013
jponch
117
7.1k
Why You Should Never Use an ORM
jnunemaker
PRO
55
9.2k
How STYLIGHT went responsive
nonsquared
99
5.4k
Designing for humans not robots
tammielis
250
25k
The Cult of Friendly URLs
andyhume
78
6.2k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
175
52k
How to Think Like a Performance Engineer
csswizardry
22
1.4k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
How to Ace a Technical Interview
jacobian
276
23k
The Cost Of JavaScript in 2023
addyosmani
47
7.4k

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