電話號碼輸入組件示範
帶國碼選擇器的電話號碼輸入組件，使用 flag-icons 顯示國旗
此組件由 Antigravity AI 協助建置
基本用法
預設使用台灣 (+886) 國碼
+886
美國 / 加拿大 +1
英國 +44
阿富汗 +93
阿根廷 +54
奧地利 +43
澳大利亞 +61
巴林 +973
孟加拉 +880
比利時 +32
不丹 +975
玻利維亞 +591
巴西 +55
柬埔寨 +855
喀麥隆 +237
中國 +86
安圭拉 +1264
安地瓜 +1268
阿魯巴 +297
百慕達 +1441
多明尼加 +1767
格瑞那達 +1473
聖盧西亞 +1758
哥倫比亞 +57
新加坡 +ˊ65
剛果共和國 +243
瑞士 +41
德國 +49
丹麥 +45
埃及 +20
西班牙 +34
薩爾瓦多 +503
芬蘭 +358
斐濟 +679
法國 +33
喬治亞 +995
迦納 +233
希臘 +30
瓜地馬拉 +502
蓋亞那 / 葉門 +967
海地 +509
宏都拉斯 +504
香港 +852
印度 +91
冰島 +354
印尼 +62
伊拉克 +964
愛爾蘭 +353
義大利 +39
牙買加 +1876
約旦 +962
哈薩克 / 俄羅斯 +7
肯亞 +254
日本 +81
韓國 +82
科威特 +965
盧森堡 +352
澳門 +853
馬其頓 +389
馬達加斯加 +261
馬來西亞 +60
馬爾地夫 +960
墨西哥 +52
摩洛哥 +212
挪威 +47
諾魯 +674
紐西蘭 +64
尼加拉瓜 +505
奈及利亞 +234
巴基斯坦 +92
巴拿馬 +507
巴布亞紐幾內亞 +675
葡萄牙 +351
巴拉圭 +595
羅馬尼亞 +40
盧旺達 +250
沙烏地阿拉伯 +966
敘利亞 +381
塞席爾 +248
斯里蘭卡 +94
新加坡 +65
蘇丹 +249
瑞典 +46
泰國 +66
台灣 +886
湯加群島 +676
土耳其 +90
烏干達 +256
烏克蘭 +380
阿拉伯聯合大公國 +971
烏拉圭 +598
烏茲別克 +998
委內瑞拉 +58
荷蘭 +31
輸出值：
(尚未輸入)自訂預設國碼
設定預設為美國 (+1) 國碼
+886
美國 / 加拿大 +1
英國 +44
阿富汗 +93
阿根廷 +54
奧地利 +43
澳大利亞 +61
巴林 +973
孟加拉 +880
比利時 +32
不丹 +975
玻利維亞 +591
巴西 +55
柬埔寨 +855
喀麥隆 +237
中國 +86
安圭拉 +1264
安地瓜 +1268
阿魯巴 +297
百慕達 +1441
多明尼加 +1767
格瑞那達 +1473
聖盧西亞 +1758
哥倫比亞 +57
新加坡 +ˊ65
剛果共和國 +243
瑞士 +41
德國 +49
丹麥 +45
埃及 +20
西班牙 +34
薩爾瓦多 +503
芬蘭 +358
斐濟 +679
法國 +33
喬治亞 +995
迦納 +233
希臘 +30
瓜地馬拉 +502
蓋亞那 / 葉門 +967
海地 +509
宏都拉斯 +504
香港 +852
印度 +91
冰島 +354
印尼 +62
伊拉克 +964
愛爾蘭 +353
義大利 +39
牙買加 +1876
約旦 +962
哈薩克 / 俄羅斯 +7
肯亞 +254
日本 +81
韓國 +82
科威特 +965
盧森堡 +352
澳門 +853
馬其頓 +389
馬達加斯加 +261
馬來西亞 +60
馬爾地夫 +960
墨西哥 +52
摩洛哥 +212
挪威 +47
諾魯 +674
紐西蘭 +64
尼加拉瓜 +505
奈及利亞 +234
巴基斯坦 +92
巴拿馬 +507
巴布亞紐幾內亞 +675
葡萄牙 +351
巴拉圭 +595
羅馬尼亞 +40
盧旺達 +250
沙烏地阿拉伯 +966
敘利亞 +381
塞席爾 +248
斯里蘭卡 +94
新加坡 +65
蘇丹 +249
瑞典 +46
泰國 +66
台灣 +886
湯加群島 +676
土耳其 +90
烏干達 +256
烏克蘭 +380
阿拉伯聯合大公國 +971
烏拉圭 +598
烏茲別克 +998
委內瑞拉 +58
荷蘭 +31
輸出值：
(尚未輸入)返回完整對象
使用 return-object 屬性獲取完整的電話號碼資訊
+886
美國 / 加拿大 +1
英國 +44
阿富汗 +93
阿根廷 +54
奧地利 +43
澳大利亞 +61
巴林 +973
孟加拉 +880
比利時 +32
不丹 +975
玻利維亞 +591
巴西 +55
柬埔寨 +855
喀麥隆 +237
中國 +86
安圭拉 +1264
安地瓜 +1268
阿魯巴 +297
百慕達 +1441
多明尼加 +1767
格瑞那達 +1473
聖盧西亞 +1758
哥倫比亞 +57
新加坡 +ˊ65
剛果共和國 +243
瑞士 +41
德國 +49
丹麥 +45
埃及 +20
西班牙 +34
薩爾瓦多 +503
芬蘭 +358
斐濟 +679
法國 +33
喬治亞 +995
迦納 +233
希臘 +30
瓜地馬拉 +502
蓋亞那 / 葉門 +967
海地 +509
宏都拉斯 +504
香港 +852
印度 +91
冰島 +354
印尼 +62
伊拉克 +964
愛爾蘭 +353
義大利 +39
牙買加 +1876
約旦 +962
哈薩克 / 俄羅斯 +7
肯亞 +254
日本 +81
韓國 +82
科威特 +965
盧森堡 +352
澳門 +853
馬其頓 +389
馬達加斯加 +261
馬來西亞 +60
馬爾地夫 +960
墨西哥 +52
摩洛哥 +212
挪威 +47
諾魯 +674
紐西蘭 +64
尼加拉瓜 +505
奈及利亞 +234
巴基斯坦 +92
巴拿馬 +507
巴布亞紐幾內亞 +675
葡萄牙 +351
巴拉圭 +595
羅馬尼亞 +40
盧旺達 +250
沙烏地阿拉伯 +966
敘利亞 +381
塞席爾 +248
斯里蘭卡 +94
新加坡 +65
蘇丹 +249
瑞典 +46
泰國 +66
台灣 +886
湯加群島 +676
土耳其 +90
烏干達 +256
烏克蘭 +380
阿拉伯聯合大公國 +971
烏拉圭 +598
烏茲別克 +998
委內瑞拉 +58
荷蘭 +31
輸出對象：
null
自訂下拉選單寬度
調整國碼選擇器下拉選單的寬度
+886
美國 / 加拿大 +1
英國 +44
阿富汗 +93
阿根廷 +54
奧地利 +43
澳大利亞 +61
巴林 +973
孟加拉 +880
比利時 +32
不丹 +975
玻利維亞 +591
巴西 +55
柬埔寨 +855
喀麥隆 +237
中國 +86
安圭拉 +1264
安地瓜 +1268
阿魯巴 +297
百慕達 +1441
多明尼加 +1767
格瑞那達 +1473
聖盧西亞 +1758
哥倫比亞 +57
新加坡 +ˊ65
剛果共和國 +243
瑞士 +41
德國 +49
丹麥 +45
埃及 +20
西班牙 +34
薩爾瓦多 +503
芬蘭 +358
斐濟 +679
法國 +33
喬治亞 +995
迦納 +233
希臘 +30
瓜地馬拉 +502
蓋亞那 / 葉門 +967
海地 +509
宏都拉斯 +504
香港 +852
印度 +91
冰島 +354
印尼 +62
伊拉克 +964
愛爾蘭 +353
義大利 +39
牙買加 +1876
約旦 +962
哈薩克 / 俄羅斯 +7
肯亞 +254
日本 +81
韓國 +82
科威特 +965
盧森堡 +352
澳門 +853
馬其頓 +389
馬達加斯加 +261
馬來西亞 +60
馬爾地夫 +960
墨西哥 +52
摩洛哥 +212
挪威 +47
諾魯 +674
紐西蘭 +64
尼加拉瓜 +505
奈及利亞 +234
巴基斯坦 +92
巴拿馬 +507
巴布亞紐幾內亞 +675
葡萄牙 +351
巴拉圭 +595
羅馬尼亞 +40
盧旺達 +250
沙烏地阿拉伯 +966
敘利亞 +381
塞席爾 +248
斯里蘭卡 +94
新加坡 +65
蘇丹 +249
瑞典 +46
泰國 +66
台灣 +886
湯加群島 +676
土耳其 +90
烏干達 +256
烏克蘭 +380
阿拉伯聯合大公國 +971
烏拉圭 +598
烏茲別克 +998
委內瑞拉 +58
荷蘭 +31
輸出值：
(尚未輸入)表單整合示範
在表單中使用電話號碼輸入組件
API 說明
Props
| 屬性名稱 | 類型 | 預設值 | 說明 |
|---|---|---|---|
modelValue | String | Object | '' | v-model 綁定值 |
defaultCountryCode | String | 'TW' | 預設國碼（ISO 3166-1 alpha-2） |
placeholder | String | '請輸入電話號碼' | 輸入框佔位符 |
optionListWidth | String | Number | '280px' | 下拉選單寬度 |
returnObject | Boolean | false | 是否返回完整對象 |
Events
| 事件名稱 | 參數 | 說明 |
|---|---|---|
update:modelValue | value: String | Object | 值變更時觸發 |
change | value: String | Object | 值變更時觸發 |
focus | - | 輸入框獲得焦點時觸發 |
blur | - | 輸入框失去焦點時觸發 |
返回對象格式（當 returnObject 為 true）
{
countryCode: 'TW', // 國家代碼
countryName: '台灣', // 國家名稱
phoneCode: '886', // 電話國碼
phoneNumber: '912345678', // 電話號碼
fullNumber: '+886912345678' // 完整電話號碼
}