vue 列表城市选择 带搜索

实现城市列表，此功能提供城市三字码， 可用于飞机城市预订什么的，筛选参考的是weex-ui的wxc-city组件

注意返回的iconFont可以自己的

• 效果展示下

  
  IIFlQDITya.gif

• vue文件

<template>
    <div class="wrapper" :class="showPage ? 'show' : 'hide'">
        <div class="header">
            <div style="height: 100%; width: 60upx;" @click="back"><text class="icon-font" style="color: white">&#xe654;</text></div>
            <div class="middle"><input class="input" @input="onInput" placeholder="搜索城市" v-model="searchValue" /></div>
        </div>
        <scroll-view class="calendar-list" scroll-y="true" :scroll-into-view="scrollIntoId">
            <view v-if="searchValue == ''">
                <view class="letter-header" id="hot">热门城市</view>
                <view class="city-div" v-for="(hot, index) in hotCity" :key="index" @click="cityClick(hot)">
                    <text class="city">{{ hot.cityName }}</text>
                </view>
            </view>
            <view v-if="searchValue == ''" v-for="(item, index) in list" :id="getId(index)" :key="index">
                <view class="letter-header">{{ getId(index) }}</view>
                <view class="city-div" v-for="(city, i) in item" :key="i" @click="cityClick(city)">
                    <text class="city">{{ city.cityName }}</text>
                </view>
            </view>

            <view class="city-div" v-for="(item, index) in searchList" :key="index" @click="cityClick(item)">
                <text class="city">{{ item.cityName }}</text>
            </view>
        </scroll-view>
        <view class="letter" v-if="searchValue == ''">
            <view class="index-item" style="font-size: 18upx;" @click="scrollTo('hot')">热门</view>
            <view class="index-item" v-for="item in letter" :key="item" @click="scrollTo(item)">{{ item }}</view>
        </view>

        <view class="mask" v-if="showMask">
            <view class="mask-r">{{selectLetter}}</view>
        </view>
    </div>
</template>

<script>
import Citys from '../../../common/city.js';
export default {
    components: {},
    props: {},

    computed: {
        hotCity() {
            return Citys.hotCity;
        },

        citys() {
            return Citys.cities;
        }
    },

    data: () => ({
        showPage: false,
        letter: [],
        selectLetter: '',
        searchValue: '',
        scrollIntoId: '',
        list: [],
        tId: null,
        searchList: [],
        showMask: false
    }),

    created() {
        //获取city.js 的程序字母
        var mu = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'j', 'k', 'l', 'm', 'n', 'p', 'q', 'r', 's', 't', 'w', 'x', 'y', 'z'];
        var tmp = [];
        for (var i = 0; i < mu.length; i++) {
            var item = mu[i];
            for (var j = 0; j < this.citys.length; j++) {
                var py = this.citys[j].py;
                if (py.substring(0, 1) == item) {
                    if (tmp.indexOf(item) == -1) {
                        this.list[i] = [this.citys[j]];
                        tmp.push(item);
                        this.letter.push(item.toUpperCase());
                    } else {
                        this.list[i].push(this.citys[j]);
                    }
                }
            }
        }
    },

    mounted() {},

    methods: {
        getId(index) {
            return this.letter[index];
        },

        scrollTo(letter) {
            this.showMask = true
            this.selectLetter = letter == 'hot' ? '热': letter
            setTimeout(() => {
                this.showMask = false
            }, 300);
            this.scrollIntoId = letter;
        },

        show() {
            this.showPage = true;
        },

        back() {
            this.showPage = false;
        },

        query(source, text) {
            let res = [];
            var self = this;
            res = source.filter(item => {
                const arr = [];
                let isHave = false;
                Object.keys(item).forEach(prop => {
                    const itemStr = item[prop];
                    self.isString(itemStr) &&
                        itemStr.split(',').forEach(val => {
                            arr.push(val);
                        });
                });
                arr.some(val => {
                    isHave = new RegExp('^' + text).test(val);
                    return isHave;
                });
                return isHave;
            });
            console.log(JSON.stringify(res));
            return res;
        },

        isString(obj) {
            return typeof obj === 'string';
        },

        onInput(e) {
            // clearTimeout(this.tId);

            const value = e.target.value;
            console.log(value);
            if (value !== '' && this.citys && this.citys.length > 0) {
                const queryData = this.query(this.citys, String(value).trim());
                this.searchList = queryData;
            } else {
                this.searchList = [];
            }
            //         this.tId = setTimeout(() => {
            //           this.$emit('wxcCityOnInput', {
            //             value: e.value
            //           });
            //         }, 300);
        },

        cityClick(item) {
            this.$emit('cityClick', item);
            this.back()
        }
    }
};
</script>

<style>
@font-face {
    font-family: 'iconfont';
    src: url('~@/static/iconfont/iconfont.ttf');
}
.wrapper {
    position: fixed;
    z-index: 999999;
    background: #ffffff;
    height: 100%;
    width: 100%;
    top: 0px;
    left: 0px;
}

.mask {
    position: absolute;
    bottom: 0upx;
    top: 83upx;
    left: 0upx;
    right: 0upx;
    width: 750upx;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(0, 0, 0, 0);
}

.mask-r{
    height: 120upx;
    width: 120upx;
    border-radius: 60upx;
    display: flex;
    background: rgba(0, 0, 0, 0.5);
    justify-content: center;
    align-items: center;
    font-size: 40upx;
    color: #FFFFFF
}

.content {
    height: 100%;
    width: 100%;
    background-color: #ffffff;
}

.header {
    height: 83upx;
    background-color: #00aafb;
    display: flex;
    flex-direction: row;
    padding-top: 15upx;
    padding-left: 15upx;
}

.icon-font {
    font-family: 'iconfont';
    font-size: 30upx;
}

.middle {
    width: 100%;
    padding-right: 30upx;
    display: flex;
    justify-content: center;
}

.input {
    background-color: #ffffff;
    flex: 1;
    margin-right: 10upx;
    padding-left: 10upx;
}

.title {
    font-size: 30upx;
    color: white;
}
.show {
    left: 0;
    width: 100%;
    transition: left 0.3s ease;
}

.hide {
    left: 100%;
    width: 100%;
    transition: left 0.2s ease;
}
.icon-font {
    font-family: 'iconfont';
    font-size: 30upx;
}

.title {
    font-size: 30upx;
    color: white;
}
.calendar-list {
    position: absolute;
    top: 83upx;
    bottom: 0upx;
    width: 100%;
}

.letter {
    position: absolute;
    right: 0upx;
    bottom: 0px;
    width: 50upx;
    top: 83upx;
    color: #2f9bfe;
    text-align: center;
    font-size: 22upx;
}

.letter-header {
    height: 45upx;
    font-size: 22upx;
    color: #333333;
    padding-left: 20upx;
    background-color: #ebedef;
}

.city-div {
    height: 68upx;
    border-bottom-width: 0.5upx;
    border-bottom-color: #ebedef;
    border-bottom-style: solid;
    display: flex;
    align-items: center;
    margin-right: 35upx;
}

.city {
    font-size: 28upx;
    color: #000000;
    padding-left: 20upx;
}
</style>

• js数据

/**
 * Created by dianwoda on 2019/3/28.
 * // A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
    // { cityName: '', pinYin: '', py: '', code: '', airName: ''},
 */
export default {
  hotCity: [
    { cityName: '北京', pinYin: 'beijing', py: 'bj', code: 'PEK'},
    { cityName: '上海', pinYin: 'shanghai', py: 'sh', code: 'SHA'},
    { cityName: '天津', pinYin: 'tianjin', py: 'tj', code: 'TSN'},
    { cityName: '青岛', pinYin: 'qingdao', py: 'qd', code: 'TAO'},
    { cityName: '南京', pinYin: 'nanjing', py: 'nj', code: 'NKG'},
    { cityName: '杭州', pinYin: 'hangzhou', py: 'hz', code: 'HGH'},
    { cityName: '厦门', pinYin: 'xiamen', py: 'xm', code: 'XMN'},
    { cityName: '成都', pinYin: 'chengdu', py: 'cd', code: 'CTU'},
    { cityName: '深圳', pinYin: 'shenzhen', py: 'sz', code: 'SZX'},
    { cityName: '广州', pinYin: 'guangzhou', py: 'gz', code: 'CAN'},
    { cityName: '沈阳', pinYin: 'shenyang', py: 'sy', code: 'SHE'},
    { cityName: '武汉', pinYin: 'wuhan', py: 'wh', code: 'WUH'}
  ],
  cities: [{
      
    "cityName": "阿尔山",
    "pinyin": "aershan",
    "py": "aes",
    "code": "YIE"
}, {
    "cityName": "阿克苏",
    "pinyin": "akesu",
    "py": "aks",
    "code": "AKU"
}, {
    "cityName": "阿勒泰",
    "pinyin": "aletai",
    "py": "alt",
    "code": "AAT"
}, {
    "cityName": "阿里",
    "pinyin": "ali",
    "py": "al",
    "code": "NGQ"
}, {
    "cityName": "安庆",
    "pinyin": "anqing",
    "py": "aq",
    "code": "AQG"
}, {
    "cityName": "鞍山",
    "pinyin": "anshan",
    "py": "as",
    "code": "AOG"
}, {
    "cityName": "安顺",
    "pinyin": "anshun",
    "py": "as",
    "code": "AVA"
}, {
    "cityName": "巴彦淖尔",
    "pinyin": "bayanzuoer",
    "py": "byze",
    "code": "RLK"
}, {
    "cityName": "百色",
    "pinyin": "baise",
    "py": "bs",
    "code": "AEB"
}, {
    "cityName": "保山",
    "pinyin": "baoshan",
    "py": "bs",
    "code": "BSD"
}, {
    "cityName": "包头",
    "pinyin": "baotou",
    "py": "bt",
    "code": "BAV"
}, {
    "cityName": "北海",
    "pinyin": "beihai",
    "py": "bh",
    "code": "BHY"
}, {
    "cityName": "北京",
    "pinyin": "beijing",
    "py": "bj",
    "code": "PEK"
}, {
    "cityName": "北京南苑",
    "pinyin": "beijingnanyuan",
    "py": "bjny",
    "code": "NAY"
}, {
    "cityName": "毕节",
    "pinyin": "bijie",
    "py": "bj",
    "code": "BFJ"
}, {
    "cityName": "池州",
    "pinyin": "chizhou",
    "py": "cz",
    "code": "JUH"
}, {
    "cityName": "沧源",
    "pinyin": "cangyuan",
    "py": "cy",
    "code": "CWJ"
}, {
    "cityName": "长白山",
    "pinyin": "changbaishan",
    "py": "cbs",
    "code": "NBS"
}, {
    "cityName": "长春",
    "pinyin": "changchun",
    "py": "cc",
    "code": "CGQ"
}, {
    "cityName": "常德",
    "pinyin": "changde",
    "py": "cd",
    "code": "CGD"
}, {
    "cityName": "长沙",
    "pinyin": "changsha",
    "py": "cs",
    "code": "CSX"
}, {
    "cityName": "常州",
    "pinyin": "changzhou",
    "py": "cz",
    "code": "CZX"
}, {
    "cityName": "朝阳",
    "pinyin": "chaoyang",
    "py": "cy",
    "code": "CHG"
}, {
    "cityName": "成都",
    "pinyin": "chengdu",
    "py": "cd",
    "code": "CTU"
}, {
    "cityName": "赤峰",
    "pinyin": "chifeng",
    "py": "cf",
    "code": "CIF"
}, {
    "cityName": "重庆",
    "pinyin": "chongqing",
    "py": "cq",
    "code": "CKG"
}, {
    "cityName": "大理",
    "pinyin": "dali",
    "py": "dl",
    "code": "DLU"
}, {
    "cityName": "大连",
    "pinyin": "dalian",
    "py": "dl",
    "code": "DLC"
}, {
    "cityName": "大同",
    "pinyin": "datong",
    "py": "dt",
    "code": "DAT"
}, {
    "cityName": "达州",
    "pinyin": "dazhou",
    "py": "dz",
    "code": "DAX"
}, {
    "cityName": "丹东",
    "pinyin": "dandong",
    "py": "dd",
    "code": "DDG"
}, {
    "cityName": "丹阳",
    "pinyin": "danyang",
    "py": "dy",
    "code": "DYN"
}, {
    "cityName": "稻城",
    "pinyin": "daocheng",
    "py": "dc",
    "code": "DCY"
}, {
    "cityName": "德令哈",
    "pinyin": "delingha",
    "py": "dlh",
    "code": "HXD"
}, {
    "cityName": "东营",
    "pinyin": "dongying",
    "py": "dy",
    "code": "DOY"
}, {
    "cityName": "敦煌",
    "pinyin": "dunhuang",
    "py": "dh",
    "code": "DNH"
}, {
    "cityName": "鄂尔多斯",
    "pinyin": "eerduosi",
    "py": "eeds",
    "code": "DSN"
}, {
    "cityName": "恩施",
    "pinyin": "enshi",
    "py": "es",
    "code": "ENH"
}, {
    "cityName": "二连浩特",
    "pinyin": "erlianhaote",
    "py": "elht",
    "code": "ERL"
}, {
    "cityName": "佛山",
    "pinyin": "foshan",
    "py": "fs",
    "code": "FUO"
}, {
    "cityName": "阜阳",
    "pinyin": "fuyang",
    "py": "fy",
    "code": "FUG"
}, {
    "cityName": "福州",
    "pinyin": "fuzhou",
    "py": "fz",
    "code": "FOC"
}, {
    "cityName": "赣州",
    "pinyin": "ganzhou",
    "py": "gz",
    "code": "KOW"
}, {
    "cityName": "格尔木",
    "pinyin": "geermu",
    "py": "gem",
    "code": "GOQ"
}, {
    "cityName": "固原",
    "pinyin": "guyuan",
    "py": "gy",
    "code": "GYU"
}, {
    "cityName": "广元",
    "pinyin": "guangyuan",
    "py": "gy",
    "code": "GYS"
}, {
    "cityName": "广州",
    "pinyin": "guangzhou",
    "py": "gz",
    "code": "CAN"
}, {
    "cityName": "桂林",
    "pinyin": "guilin",
    "py": "gl",
    "code": "KWL"
}, {
    "cityName": "贵阳",
    "pinyin": "guiyang",
    "py": "gy",
    "code": "KWE"
}, {
    "cityName": "果洛",
    "pinyin": "guoluo",
    "py": "gl",
    "code": "GMQ"
}, {
    "cityName": "哈尔滨",
    "pinyin": "haerbin",
    "py": "heb",
    "code": "HRB"
}, {
    "cityName": "哈密",
    "pinyin": "hami",
    "py": "hm",
    "code": "HMI"
}, {
    "cityName": "海口",
    "pinyin": "haikou",
    "py": "hk",
    "code": "HAK"
}, {
    "cityName": "海拉尔",
    "pinyin": "hailaer",
    "py": "hle",
    "code": "HLD"
}, {
    "cityName": "邯郸",
    "pinyin": "handan",
    "py": "hd",
    "code": "HDG"
}, {
    "cityName": "汉中",
    "pinyin": "hanzhong",
    "py": "hz",
    "code": "HZG"
}, {
    "cityName": "杭州",
    "pinyin": "hangzhou",
    "py": "hz",
    "code": "HGH"
}, {
    "cityName": "合肥",
    "pinyin": "hefei",
    "py": "hf",
    "code": "HFE"
}, {
    "cityName": "和田",
    "pinyin": "hetian",
    "py": "ht",
    "code": "HTN"
}, {
    "cityName": "黑河",
    "pinyin": "heihe",
    "py": "hh",
    "code": "HEK"
}, {
    "cityName": "衡阳",
    "pinyin": "hengyang",
    "py": "hy",
    "code": "HNY"
}, {
    "cityName": "呼和浩特",
    "pinyin": "huhehaote",
    "py": "hhht",
    "code": "HET"
}, {
    "cityName": "花土沟",
    "pinyin": "huatugou",
    "py": "htg",
    "code": "HTT"
}, {
    "cityName": "淮安",
    "pinyin": "huaan",
    "py": "ha",
    "code": "HIA"
}, {
    "cityName": "黄山",
    "pinyin": "huangshan",
    "py": "hs",
    "code": "TXN"
}, {
    "cityName": "惠州",
    "pinyin": "huizhou",
    "py": "hz",
    "code": "HUZ"
}, {
    "cityName": "济南",
    "pinyin": "jinan",
    "py": "jn",
    "code": "TNA"
}, {
    "cityName": "济宁",
    "pinyin": "jining",
    "py": "jn",
    "code": "JNG"
}, {
    "cityName": "鸡西",
    "pinyin": "jixi",
    "py": "jx",
    "code": "JXA"
}, {
    "cityName": "加格达奇",
    "pinyin": "jiagedaqi",
    "py": "jgdq",
    "code": "JGD"
}, {
    "cityName": "佳木斯",
    "pinyin": "jiamusi",
    "py": "jms",
    "code": "JMU"
}, {
    "cityName": "嘉兴",
    "pinyin": "jiaxing",
    "py": "jx",
    "code": "JXS"
}, {
    "cityName": "嘉峪关",
    "pinyin": "jiayuguan",
    "py": "jyg",
    "code": "JGN"
}, {
    "cityName": "揭阳",
    "pinyin": "jieyang",
    "py": "jy",
    "code": "SWA"
}, {
    "cityName": "金昌",
    "pinyin": "jinchang",
    "py": "jc",
    "code": "JIC"
}, {
    "cityName": "锦州",
    "pinyin": "jinzhou",
    "py": "jz",
    "code": "JNZ"
}, {
    "cityName": "景德镇",
    "pinyin": "jingdezhen",
    "py": "jdz",
    "code": "JDZ"
}, {
    "cityName": "井冈山",
    "pinyin": "jinggangshan",
    "py": "jgs",
    "code": "JGS"
}, {
    "cityName": "九江",
    "pinyin": "jiujiang",
    "py": "jj",
    "code": "JIU"
}, {
    "cityName": "九寨沟",
    "pinyin": "jiuzhaigou",
    "py": "jzg",
    "code": "JZH"
}, {
    "cityName": "喀什",
    "pinyin": "kashen",
    "py": "ks",
    "code": "KHG"
}, {
    "cityName": "凯里",
    "pinyin": "kaili",
    "py": "kl",
    "code": "KJH"
}, {
    "cityName": "康定",
    "pinyin": "kangding",
    "py": "kd",
    "code": "KGT"
}, {
    "cityName": "克拉玛依",
    "pinyin": "kelamayi",
    "py": "klmy",
    "code": "KRY"
}, {
    "cityName": "库车",
    "pinyin": "kuche",
    "py": "kc",
    "code": "KCA"
}, {
    "cityName": "库尔勒",
    "pinyin": "kuerle",
    "py": "kel",
    "code": "KRL"
}, {
    "cityName": "昆明",
    "pinyin": "kunming",
    "py": "km",
    "code": "KMG"
}, {
    "cityName": "昆山",
    "pinyin": "kunshan",
    "py": "ks",
    "code": "KVN"
}, {
    "cityName": "连城",
    "pinyin": "liancheng",
    "py": "lc",
    "code": "LCX"
}, {
    "cityName": "临汾",
    "pinyin": "linfen",
    "py": "lf",
    "code": "LFQ"
}, {
    "cityName": "泸沽湖",
    "pinyin": "luguhu",
    "py": "lgh",
    "code": "NLH"
}, {
    "cityName": "拉萨",
    "pinyin": "lasa",
    "py": "ls",
    "code": "LXA"
}, {
    "cityName": "澜沧",
    "pinyin": "lancang",
    "py": "lc",
    "code": "JMJ"
}, {
    "cityName": "兰州",
    "pinyin": "lanzhou",
    "py": "lanzhou",
    "code": "LHW"
}, {
    "cityName": "丽江",
    "pinyin": "lijiang",
    "py": "lijiang",
    "code": "LJG"
}, {
    "cityName": "黎平",
    "pinyin": "liping",
    "py": "liping",
    "code": "HZH"
}, {
    "cityName": "连云港",
    "pinyin": "lianyungang",
    "py": "lyg",
    "code": "LYG"
}, {
    "cityName": "临沧",
    "pinyin": "lincang",
    "py": "lc",
    "code": "LNJ"
}, {
    "cityName": "临沂",
    "pinyin": "linyi",
    "py": "ly",
    "code": "LYI"
}, {
    "cityName": "林芝",
    "pinyin": "linzhi",
    "py": "lz",
    "code": "LZY"
}, {
    "cityName": "六盘水",
    "pinyin": "liupanshui",
    "py": "lps",
    "code": "LPF"
}, {
    "cityName": "柳州",
    "pinyin": "liuzhou",
    "py": "lz",
    "code": "LZH"
}, {
    "cityName": "陇南",
    "pinyin": "longnan",
    "py": "ln",
    "code": "LNL"
}, {
    "cityName": "泸州",
    "pinyin": "luzhou",
    "py": "lz",
    "code": "LZO"
}, {
    "cityName": "洛阳",
    "pinyin": "luoyang",
    "py": "ly",
    "code": "LYA"
}, {
    "cityName": "吕梁",
    "pinyin": "lvliang",
    "py": "ll",
    "code": "LLV"
}, {
    "cityName": "茅台",
    "pinyin": "maotai",
    "py": "mt",
    "code": "WMT"
}, {
    "cityName": "满洲里",
    "pinyin": "manzhouli",
    "py": "mzl",
    "code": "NZH"
}, {
    "cityName": "芒市",
    "pinyin": "mangshi",
    "py": "ms",
    "code": "LUM"
}, {
    "cityName": "绵阳",
    "pinyin": "mianyang",
    "py": "my",
    "code": "MIG"
}, {
    "cityName": "漠河",
    "pinyin": "mohe",
    "py": "mh",
    "code": "OHE"
}, {
    "cityName": "牡丹江",
    "pinyin": "mudanjiang",
    "py": "mdj",
    "code": "MDG"
}, {
    "cityName": "南昌",
    "pinyin": "nanchang",
    "py": "nc",
    "code": "KHN"
}, {
    "cityName": "南充",
    "pinyin": "nanchong",
    "py": "nc",
    "code": "NAO"
}, {
    "cityName": "南京",
    "pinyin": "nanjing",
    "py": "nj",
    "code": "NKG"
}, {
    "cityName": "南宁",
    "pinyin": "nanning",
    "py": "nn",
    "code": "NNG"
}, {
    "cityName": "南通",
    "pinyin": "nantong",
    "py": "nt",
    "code": "NTG"
}, {
    "cityName": "南阳",
    "pinyin": "nanyang",
    "py": "ny",
    "code": "NNY"
}, {
    "cityName": "宁波",
    "pinyin": "ningbo",
    "py": "nb",
    "code": "NGB"
}, {
    "cityName": "攀枝花",
    "pinyin": "panzhihua",
    "py": "pzh",
    "code": "PZI"
}, {
    "cityName": "祁连县",
    "pinyin": "qilianxian",
    "py": "qlx",
    "code": "HBQ"
}, {
    "cityName": "齐齐哈尔",
    "pinyin": "qiqihaer",
    "py": "qqhe",
    "code": "NDG"
}, {
    "cityName": "黔江",
    "pinyin": "qianjiang",
    "py": "qj",
    "code": "JIQ"
}, {
    "cityName": "秦皇岛",
    "pinyin": "qinhuadao ",
    "py": "qhd ",
    "code": "BPE"
}, {
    "cityName": "青岛",
    "pinyin": "qingdao",
    "py": "qd",
    "code": "TAO"
}, {
    "cityName": "庆阳",
    "pinyin": "qy",
    "py": "QingYang",
    "code": "IQN"
}, {
    "cityName": "琼海",
    "pinyin": "qionghai",
    "py": "qh",
    "code": "BAR"
}, {
    "cityName": "衢州",
    "pinyin": "quzhou",
    "py": "qz",
    "code": "JUZ"
}, {
    "cityName": "泉州",
    "pinyin": "quanzhou",
    "py": "qz",
    "code": "JJN"
}, {
    "cityName": "日喀则",
    "pinyin": "rikaze",
    "py": "rkz",
    "code": "RKZ"
}, {
    "cityName": "日照",
    "pinyin": "rizhao",
    "py": "rz",
    "code": "RIZ"
}, {
    "cityName": "三明",
    "pinyin": "sanming",
    "py": "sm",
    "code": "SQJ"
}, {
    "cityName": "松原",
    "pinyin": "songyuan",
    "py": "sy",
    "code": "YSQ"
}, {
    "cityName": "上海",
    "pinyin": "shanghai",
    "py": "sh",
    "code": "SHA"
}, {
    "cityName": "上海浦东",
    "pinyin": "shanghaipudong",
    "py": "shpd",
    "code": "PVG"
}, {
    "cityName": "上饶",
    "pinyin": "shangrao",
    "py": "sr",
    "code": "SQD"
}, {
    "cityName": "邵阳",
    "pinyin": "shaoyang",
    "py": "sy",
    "code": "WGN"
}, {
    "cityName": "神农架",
    "pinyin": "shennongjia",
    "py": "snj",
    "code": "HPG"
}, {
    "cityName": "沈阳",
    "pinyin": "shenyang",
    "py": "sy",
    "code": "SHE"
}, {
    "cityName": "深圳",
    "pinyin": "shenzhen",
    "py": "ss",
    "code": "SZX"
}, {
    "cityName": "石河子",
    "pinyin": "shihezi",
    "py": "shz",
    "code": "SHF"
}, {
    "cityName": "石家庄",
    "pinyin": "shijiazhuang",
    "py": "sjz",
    "code": "SJW"
}, {
    "cityName": "十堰",
    "pinyin": "shiyan",
    "py": "sy",
    "code": "WDS"
}, {
    "cityName": "苏州",
    "pinyin": "suzhou",
    "py": "sz",
    "code": "SZV"
}, {
    "cityName": "太原",
    "pinyin": "taiyuan",
    "py": "ty",
    "code": "TYN"
}, {
    "cityName": "台州",
    "pinyin": "taizhou",
    "py": "tz",
    "code": "HYN"
}, {
    "cityName": "唐山",
    "pinyin": "tangshan",
    "py": "ts",
    "code": "TVS"
}, {
    "cityName": "腾冲",
    "pinyin": "tengchong",
    "py": "tc",
    "code": "TCZ"
}, {
    "cityName": "天津",
    "pinyin": "tianjin",
    "py": "tj",
    "code": "TSN"
}, {
    "cityName": "通化",
    "pinyin": "tonghua",
    "py": "th",
    "code": "TNH"
}, {
    "cityName": "通辽",
    "pinyin": "tongliao",
    "py": "tl",
    "code": "TGO"
}, {
    "cityName": "铜仁",
    "pinyin": "tongren",
    "py": "tr",
    "code": "TEN"
}, {
    "cityName": "桐乡",
    "pinyin": "tongxiang",
    "py": "tx",
    "code": "TVX"
}, {
    "cityName": "吐鲁番",
    "pinyin": "tulufan",
    "py": "tlf",
    "code": "TLQ"
}, {
    "cityName": "乌兰察布",
    "pinyin": "wulanchabu",
    "py": "wlcb",
    "code": "UCB"
}, {
    "cityName": "五台山",
    "pinyin": "wutaishan",
    "py": "wts",
    "code": "WUT"
}, {
    "cityName": "万州",
    "pinyin": "wanzhou",
    "py": "wz",
    "code": "WXN"
}, {
    "cityName": "威海",
    "pinyin": "weihai",
    "py": "wh",
    "code": "WEH"
}, {
    "cityName": "文山",
    "pinyin": "wenshan",
    "py": "ws",
    "code": "WNH"
}, {
    "cityName": "温州",
    "pinyin": "wenzhou",
    "py": "wz",
    "code": "WNZ"
}, {
    "cityName": "乌海",
    "pinyin": "wuhai",
    "py": "wh",
    "code": "WUA"
}, {
    "cityName": "武汉",
    "pinyin": "whhan",
    "py": "wh",
    "code": "WUH"
}, {
    "cityName": "乌兰浩特",
    "pinyin": "wulanhaote",
    "py": "wlht",
    "code": "HLH"
}, {
    "cityName": "乌鲁木齐",
    "pinyin": "wulumuqi",
    "py": "wlmq",
    "code": "URC"
}, {
    "cityName": "无锡",
    "pinyin": "wuxi",
    "py": "wx",
    "code": "WUX"
}, {
    "cityName": "武夷山",
    "pinyin": "wuyishan",
    "py": "wys",
    "code": "WUS"
}, {
    "cityName": "梧州",
    "pinyin": "wuzhou",
    "py": "wz",
    "code": "WUZ"
}, {
    "cityName": "西安",
    "pinyin": "xian",
    "py": "xa",
    "code": "SIA"
}, {
    "cityName": "西昌",
    "pinyin": "xichang",
    "py": "xc",
    "code": "XIC"
}, {
    "cityName": "锡林浩特",
    "pinyin": "xilinhaote",
    "py": "xlht",
    "code": "XIL"
}, {
    "cityName": "西宁",
    "pinyin": "xining",
    "py": "xn",
    "code": "XNN"
}, {
    "cityName": "西双版纳",
    "pinyin": "xushuangbanna",
    "py": "xsbn",
    "code": "JHG"
}, {
    "cityName": "厦门",
    "pinyin": "xiamen",
    "py": "xm",
    "code": "XMN"
}, {
    "cityName": "香格里拉",
    "pinyin": "xianggelila",
    "py": "xgll",
    "code": "DIG"
}, {
    "cityName": "襄阳",
    "pinyin": "xiangyang",
    "py": "xy",
    "code": "XFN"
}, {
    "cityName": "信阳市",
    "pinyin": "xinyang",
    "py": "xy",
    "code": "XAI"
}, {
    "cityName": "兴义",
    "pinyin": "xingyi",
    "py": "xy",
    "code": "ACX"
}, {
    "cityName": "徐州",
    "pinyin": "xuzhou",
    "py": "xz",
    "code": "XUZ"
}, {
    "cityName": "延安",
    "pinyin": "yanan",
    "py": "ya",
    "code": "ENY"
}, {
    "cityName": "盐城",
    "pinyin": "yancheng",
    "py": "yc",
    "code": "YNZ"
}, {
    "cityName": "延吉",
    "pinyin": "yanji",
    "py": "yj",
    "code": "YNJ"
}, {
    "cityName": "烟台",
    "pinyin": "yantai",
    "py": "yt",
    "code": "YNT"
}, {
    "cityName": "扬州",
    "pinyin": "yangzhou",
    "py": "yz",
    "code": "YTY"
}, {
    "cityName": "宜宾",
    "pinyin": "yibin",
    "py": "yb",
    "code": "YBP"
}, {
    "cityName": "宜昌",
    "pinyin": "yichang",
    "py": "yc",
    "code": "YIH"
}, {
    "cityName": "伊春",
    "pinyin": "yichun",
    "py": "yc",
    "code": "LDS"
}, {
    "cityName": "伊宁",
    "pinyin": "yining",
    "py": "yn",
    "code": "YIN"
}, {
    "cityName": "义乌",
    "pinyin": "yiwu",
    "py": "yw",
    "code": "YIW"
}, {
    "cityName": "银川",
    "pinyin": "yinchuan",
    "py": "yc",
    "code": "INC"
}, {
    "cityName": "营口",
    "pinyin": "yingkou",
    "py": "yk",
    "code": "YKH"
}, {
    "cityName": "永州",
    "pinyin": "yongzhou",
    "py": "yz",
    "code": "LLF"
}, {
    "cityName": "榆林",
    "pinyin": "yulin",
    "py": "yl",
    "code": "UYN"
}, {
    "cityName": "玉树",
    "pinyin": "yushu",
    "py": "ys",
    "code": "YUS"
}, {
    "cityName": "运城",
    "pinyin": "yuncheng",
    "py": "yc",
    "code": "YCU"
}, {
    "cityName": "湛江",
    "pinyin": "zhanjiang",
    "py": "zj",
    "code": "ZHA"
}, {
    "cityName": "张家界",
    "pinyin": "zhangjiajie",
    "py": "zjj",
    "code": "DYG"
}, {
    "cityName": "张家口",
    "pinyin": "zhangjiakou",
    "py": "zjk",
    "code": "ZQZ"
}, {
    "cityName": "张掖",
    "pinyin": "zhangye",
    "py": "zy",
    "code": "YZY"
}, {
    "cityName": "昭通",
    "pinyin": "zhaotong",
    "py": "zt",
    "code": "ZAT"
}, {
    "cityName": "镇江",
    "pinyin": "zhenjiang",
    "py": "zj",
    "code": "ZUJ"
}, {
    "cityName": "郑州",
    "pinyin": "zhengzhou",
    "py": "zz",
    "code": "CGO"
}, {
    "cityName": "中卫",
    "pinyin": "zhongwei",
    "py": "zw",
    "code": "ZHY"
}, {
    "cityName": "舟山",
    "pinyin": "zhoushan",
    "py": "zs",
    "code": "HSN"
}, {
    "cityName": "珠海",
    "pinyin": "zhuhai",
    "py": "zh",
    "code": "ZUH"
}, {
    "cityName": "遵义",
    "pinyin": "zunyi",
    "py": "zy",
    "code": "ZYI"
}, {
    "cityName": "大庆",
    "pinyin": "daqing",
    "py": "dq",
    "code": "DQA"
}, {
    "cityName": "普洱",
    "pinyin": "puer",
    "py": "pe",
    "code": "SYM"
}, {
    "cityName": "三亚",
    "pinyin": "sanya",
    "py": "sy",
    "code": "SYX"
}],
};