select 選擇器
視頻及原型文件下載:https://study.163.com/course/courseMain.htm?courseId=1209770824&share=2&shareId=400000000540015
定義:用戶通過(guò)選擇枚舉項(xiàng)酥夭,提交到服務(wù)器,后端存儲(chǔ)為枚舉項(xiàng)担巩。當(dāng)選項(xiàng)過(guò)多時(shí)餐济,使用下拉菜單展示并選擇內(nèi)容
交互原則:
1、選項(xiàng)數(shù)目在5~15個(gè)之間混槐。(針對(duì)多余15個(gè)的情況,可考慮使用具有搜索功能的下拉框);
2敢茁、重要度較高、常用的高頻選項(xiàng)放在前面耗拓;
3拇颅、選擇框內(nèi)要有引導(dǎo)用戶操作的提示標(biāo)簽,避免無(wú)標(biāo)簽或”請(qǐng)選擇”之類(lèi)的標(biāo)簽乔询。
交互說(shuō)明:
1樟插、【默認(rèn)文案】:默認(rèn)的提示文案內(nèi)容,例如:請(qǐng)選擇所在省份竿刁;
2黄锤、【選擇框內(nèi)容序列】:選擇框內(nèi)可選擇項(xiàng)的序列,例如:選擇框內(nèi)容為:待付款食拜、待發(fā)貨鸵熟、待收貨、待評(píng)價(jià)负甸、已完成流强;
3、【選這款樣式】:需要說(shuō)明選擇框的具體樣式呻待,選擇框的樣式有:可清空選擇框打月、可搜索選擇框、單選蚕捉、多選奏篙;
使用場(chǎng)景:
1.彈出一個(gè)下拉選項(xiàng)給用戶選擇操作
2.當(dāng)選項(xiàng)少時(shí)(少于 5 項(xiàng)),建議直接將選項(xiàng)平鋪迫淹,使用 Radio 是更好的選擇秘通。
例如淘寶賣(mài)家后臺(tái)篩選訂單的狀態(tài)時(shí),點(diǎn)擊選擇器千绪,出現(xiàn)下拉列表充易。這就是一個(gè)常見(jiàn)的選擇器,選擇器分為多選和單選兩大類(lèi)