微信小程序实现根据字母选择城市的功能

发布日期： 2018-06-27 阅读量： 作者： 网络

这篇文章主要为大家详细介绍了微信小程序中根据字母选择城市的相关方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

今天开发一个小程序，里面涉及到区域选择，看了网上的一些版本，感觉写的不全，有可能是我的理解能力还不够吧。今天我就结合网上的答案，在根据自己的需求，重新整理一份。希望对大家有帮助。先看看截图：

项目截图

下面我们把代码梳理一下。

一、创建index.wxml文件

在pages->index文件夹下，新建index.wxml文件，代码如下：

 class="title"&gt;
  class="title_list" value="{{cityName}}" placeholder="城市名称" /&gt;
 确认
  scroll-y="true" style="height: {{winHeight}}px;" scroll-into-view="{{scrollTopId}}" class="city_list"&gt;
   wx:for="{{city}}" wx:for-index="idx" wx:for-item="cityName"&gt;
    id="{{idx}}" class="list_tit"&gt;{{idx}}
    wx:for="{{cityName}}"&gt;
     class="list_con" data-city="{{item.name}}" bindtap="bindCity"&gt;{{item.name}}
   
  
 class="scroll_list" 
   bindtouchstart="chStart"
   bindtouchend="chEnd"
   catchtouchmove="chMove"
   style="background: rgba(0,0,0,{{trans}});"
   &gt;
  wx:for="{{city}}" wx:for-index="idx" wx:for-item="cityName"&gt;
    wx:if="{{idx != '热门城市'}}"&gt;
    id="{{idx}}" class="scroll_list_chi" style="line-height:{{lineHeight}}px ; height:{{lineHeight}}px ;font-size:{{lineHeight/1.7}}px;" bindtouchstart="getWords" bindtouchend="setWords"&gt;{{idx}}
   
  
 hidden="{{hidden}}" class="showwords"&gt;
 {{showwords}}

# 微信小程序字母选择城市 # 微信小程序选择城市 # 微信小程序字母选择

相关栏目：【 SEO优化45326 】【技术教程24582 】【 IDC资讯40819 】【网络快讯1972 】【 SEO推广1912 】

上一篇: JavaScript Promise 返回数组为何显示 un

下一篇: windows10如何加速开关机速度

微信小程序实现根据字母选择城市的功能

随便看看