插件描述：基于Vue移動端城市選擇插件

更新時間：2020-09-06 00:32:37

更新說明：修改vue cdn調用地址訪問更快

更新時間：2018/10/29 上午9:30:22

更新說明：

城市列表多添加了便簽，解決移動端點擊字母時觸發到城市選擇事件。

{{item.city}}

search方法添加 document.documentElement.scrollTop=0; 解決出現滾動條后點擊搜索，搜索結果被header遮擋的問題//搜索框獲取焦點進入搜索層

search:?function()?{

this.isCancel?=?true;

document.documentElement.scrollTop?=?0;

},

發布時間：2018-10-29 0:19

基于Vue的城市選擇插件

字體文件可以不要

對應的input和組件()需要包含在對應盒子內(el:'.adminBox',)。

對應的城市寫在cityChoice.js的citys數組內，//熱門城市

hostCityss:?function()?{

var?j?=?0;

for?(var?i?=?0;?i?

Vue.set(this.hostCitys,?j,?this.citys[i]);

j++

}

},

前15條為熱門城市，熱門城市對應在citys數組內的順序不能亂， 其他的隨意。

需要添加首字母搜索的，需要在citys數組的對象內添加對應的內容

如citys:[

{city:'南寧',py:'nanning',first:'nn'},

]

然后搜索過濾處添加對應的方法//搜索過濾

sousuos:function(){

var?ssval?=?this.ssval;

return?this.citys.filter(function?(item)?{

return?item.py.indexOf(ssval)!=?-1?||?item.city.indexOf(ssval)?!=?-1?||?item.first.indexOf(ssval)!=?-1;

});

}

總結

以上是生活随笔為你收集整理的html5移动端选择城市,移动端城市选择插件（原创）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。