Skip to content

导航菜单-导航菜单的需求分析和数据设计

components/menu/src/types.ts

typescript
export interface MenuItem {
  icon?: string;
  name: string;
  index: string;
  children?: MenuItem[];
}

components/menu/src/index.vue

html
<template>
  <div class="menu">menu</div>
</template>

<script lang="ts" setup>
import { PropType } from "vue";
import { MenuItem } from "./types";

const props = defineProps({
  data: {
    type: Array as PropType<MenuItem[]>,
    required: true,
  },
  defaultActive: {
    type: String,
    default: "",
  },
  router: {
    type: Boolean,
    default: false,
  },
});
console.log(props.data);
</script>

<style lang="scss" scoped></style>

views/menu/index.vue

html
<template>
  <div class="menu">
    <m-menu :data="data1"></m-menu>
  </div>
</template>

<script lang="ts" setup>
const data1 = [
  {
    name: "导航1",
    index: "1",
    icon: "document",
  },
  {
    name: "导航2",
    index: "2",
    icon: "document",
  },
  {
    name: "导航3",
    index: "3",
    icon: "document",
    children: [
      {
        name: "导航3-1",
        index: "3-1",
        icon: "document",
      },
    ],
  },
];
</script>

<style lang="scss" scoped></style>

导航菜单-巧用 template 实现两级结构的菜单

components/menu/src/index.vue

html
<template>
  <div class="menu">
    <el-menu :default-active="defaultActive" :router="router" v-bind="$attrs">
      <template v-for="item in data" :key="item.index">
        <el-menu-item
          v-if="!item.children || !item.children.length"
          :index="item.index"
        >
          <component
            v-if="item.icon"
            :is="`el-icon-${toLine(item.icon)}`"
          ></component>
          <span>{{ item.name }}</span>
        </el-menu-item>
        <el-sub-menu
          v-if="item.children && item.children.length"
          :index="item.index"
        >
          <template #title>
            <component
              v-if="item.icon"
              :is="`el-icon-${toLine(item.icon)}`"
            ></component>
            <span>{{ item.name }}</span>
          </template>
          <el-menu-item
            v-for="item1 in item.children"
            :key="item1.index"
            :index="item1.index"
          >
            <component
              v-if="item1.icon"
              :is="`el-icon-${toLine(item1.icon)}`"
            ></component>
            <span>{{ item1.name }}</span>
          </el-menu-item>
        </el-sub-menu>
      </template>
    </el-menu>
  </div>
</template>

<script lang="ts" setup>
import { PropType } from "vue";
import { MenuItem } from "./types";
import { toLine } from "../../../utils";

const props = defineProps({
  data: {
    type: Array as PropType<MenuItem[]>,
    required: true,
  },
  defaultActive: {
    type: String,
    default: "",
  },
  router: {
    type: Boolean,
    default: false,
  },
});
</script>

<style lang="scss" scoped>
.menu {
  width: 200px;
}

svg {
  margin-right: 4px;
  width: 1em;
  height: 1em;
}
</style>

导航菜单-使用 tsx 实现无限层级菜单

实现无限层级菜单,就需要用到递归,使用tsx实现起来比较方便

首先,安装以下插件

json
npm i -D @vitejs/plugin-vue-jsx

vite.config.ts

typescript
import vueJsx from "@vitejs/plugin-vue-jsx";

export default defineConfig({
  plugins: [vue(), vueJsx()],
  server: {
    port: 8080,
  },
});

components/menu/src/types.ts

typescript
export interface MenuItem {
  icon?: string;
  i?: any; // 补个i
  name: string;
  index: string;
  children?: MenuItem[];
}

components/menu/src/menu.tsx

html
import { PropType, defineComponent, useAttrs } from "vue";
import { MenuItem } from "./types";
import { toLine } from "../../../utils";

export default defineComponent({
  props: {
    data: {
      type: Array as PropType<MenuItem[]>,
      required: true,
    },
    defaultActive: {
      type: String,
      default: "",
    },
    router: {
      type: Boolean,
      default: true,
    },
  },
  setup(props) {
    const renderMenu = (data: MenuItem[]) => {
      return data.map((item: MenuItem) => {
        item.i = `el-icon-${toLine(item.icon!)}`;
        const slots = {
          title: () => {
            return (
              <>
                <item.i />
                <span>{item.name}</span>
              </>
            );
          },
        };
        if (item.children! && item.children!.length) {
          return (
            <el-sub-menu index={item.index} v-slots={slots}>
              {renderMenu(item.children)}
            </el-sub-menu>
          );
        }
        return (
          <el-menu-item index={item.index}>
            <item.i />
            <span>{item.name}</span>
          </el-menu-item>
        );
      });
    };

    const attrs = useAttrs();

    return () => {
      return (
        <el-menu
          default-active={props.defaultActive}
          router={props.router}
          {...attrs}
        >
          {renderMenu(props.data)}
        </el-menu>
      );
    };
  },
});

components/menu/index.ts

typescript
import { App } from "vue";
import menu from "./src/index.vue";
import infiniteMenu from "./src/menu";

export default {
  install(app: App) {
    app.component("m-menu", menu);
    app.component("m-infinite-menu", infiniteMenu);
  },
};

views/menu/index.vue

html
<template>
  <div class="menu">
    <m-menu :data="data1" defaultActive="1"></m-menu>
    <m-infinite-menu :data="data2" background-color="purple"></m-infinite-menu>
  </div>
</template>

<script lang="ts" setup>
const data1 = [
  {
    name: "导航1",
    index: "1",
    icon: "document",
  },
  {
    name: "导航2",
    index: "2",
    icon: "document",
  },
  {
    name: "导航3",
    index: "3",
    icon: "document",
    children: [
      {
        name: "导航3-1",
        index: "3-1",
        icon: "document",
      },
    ],
  },
];
const data2 = [
  {
    name: "导航1",
    index: "1",
    icon: "document",
  },
  {
    name: "导航2",
    index: "2",
    icon: "document",
  },
  {
    name: "导航3",
    index: "3",
    icon: "document",
    children: [
      {
        name: "导航3-1",
        index: "3-1",
        icon: "document",
        children: [
          {
            name: "导航3-1-1",
            index: "3-1-1",
            icon: "document",
            children: [
              {
                name: "导航3-1-1-1",
                index: "3-1-1-1",
                icon: "document",
                children: [
                  {
                    name: "导航3-1-1-1-1",
                    index: "3-1-1-1-1",
                    icon: "document",
                  },
                ],
              },
            ],
          },
        ],
      },
    ],
  },
];
</script>

<style lang="scss" scoped></style>

导航菜单-利用封装好的导航菜单组件改造项目整体结构

components/container/src/navSide/index.vue

html
<template>
  <m-menu :collapse="collapse" :data="data" router :defaultActive="$route.path"></m-menu>
</template>

<script lang='ts' setup>
defineProps<{
  collapse: boolean
}>()

let data = [
  {
    icon: 'HomeFilled',
    name: '首页',
    index: '/'
  },
  {
    icon: 'Check',
    name: '图标选择器',
    index: '/chooseIcon'
  },
  {
    icon: 'Location',
    name: '省市区选择',
    index: '/chooseArea'
  },
  {
    icon: 'Sort',
    name: '趋势标记',
    index: '/trend'
  },
  {
    icon: 'Timer',
    name: '时间选择',
    index: '/chooseTime'
  },
  {
    icon: 'Bell',
    name: '通知菜单',
    index: '/notification'
  },
  {
    icon: 'Menu',
    name: '导航菜单',
    index: '/menu'
  },
  {
    icon: 'TurnOff',
    name: '城市选择',
    index: '/chooseCity'
  },
  {
    icon: 'DArrowRight',
    name: '进度条',
    index: '/progress'
  },
  {
    icon: 'ScaleToOriginal',
    name: '日历',
    index: '/calendar'
  },
  {
    icon: 'Setting',
    name: '表单',
    index: '/form'
  },
  {
    icon: 'Setting',
    name: '弹出框表单',
    index: '/modalForm'
  },
  {
    icon: 'ShoppingBag',
    name: '表格',
    index: '/table'
  }
]
</script>

<style lang='scss' scoped>
</style>

导航菜单-完善细节并增加自定义键名功能

封装的组件要简单好用,那么我们传入的键值就不能写死

html
<template>
  <el-menu
    class="el-menu-vertical-demo"
    :default-active="defaultActive"
    :router="router"
    v-bind="$attrs"
  >
    <template v-for="(item, i) in data" :key="i">
      <el-menu-item v-if="!item[children] || !item[children].length" :index="item[index]">
        <component v-if="item[icon]" :is="`el-icon-${toLine(item[icon])}`"></component>
        <span>{{ item[name] }}</span>
      </el-menu-item>
      <el-sub-menu v-if="item[children] && item[children].length" :index="item[index]">
        <template #title>
          <component v-if="item[icon]" :is="`el-icon-${toLine(item[icon])}`"></component>
          <span>{{ item[name] }}</span>
        </template>
        <el-menu-item v-for="(item1, index1) in item[children]" :key="index1" :index="item1.index">
          <component v-if="item1[icon]" :is="`el-icon-${toLine(item1[icon])}`"></component>
          <span>{{ item1[name] }}</span>
        </el-menu-item>
      </el-sub-menu>
    </template>
  </el-menu>
</template>

<script lang='ts' setup>
import { PropType } from 'vue'
import { toLine } from '../../../utils'


let props = defineProps({
  // 导航菜单的数据
  data: {
    type: Array as PropType<any[]>,
    required: true
  },
  // 默认选中的菜单
  defaultActive: {
    type: String,
    default: ''
  },
  // 是否是路由模式
  router: {
    type: Boolean,
    default: false
  },
  // 键名
  // 菜单标题的键名
  name: {
    type: String,
    default: 'name'
  },
  // 菜单标识的键名
  index: {
    type: String,
    default: 'index'
  },
  // 菜单图标的键名
  icon: {
    type: String,
    default: 'icon'
  },
  // 菜单子菜单的键名
  children: {
    type: String,
    default: 'children'
  },
})
</script>

<style lang='scss' scoped>
svg {
  margin-right: 4px;
  width: 1em;
  height: 1em;
}
.el-menu-vertical-demo:not(.el-menu--collapse) {
  width: 200px;
}
</style>
html
import { defineComponent, PropType, useAttrs } from 'vue'
import { MenuItem } from './types'
import * as Icons from '@element-plus/icons'
import './styles/index.scss'

export default defineComponent({
  props: {
    // 导航菜单的数据
    data: {
      type: Array as PropType<MenuItem[]>,
      required: true
    },
    // 默认选中的菜单
    defaultActive: {
      type: String,
      default: ''
    },
    // 是否是路由模式
    router: {
      type: Boolean,
      default: false
    },
    // 菜单标题的键名
    name: {
      type: String,
      default: 'name'
    },
    // 菜单标识的键名
    index: {
      type: String,
      default: 'index'
    },
    // 菜单图标的键名
    icon: {
      type: String,
      default: 'icon'
    },
    // 菜单子菜单的键名
    children: {
      type: String,
      default: 'children'
    },
  },
  setup(props, ctx) {
    // 封装一个渲染无限层级菜单的方法
    // 函数会返回一段jsx的代码
    let renderMenu = (data: any[]) => {
      return data.map((item: any) => {
        // 每个菜单的图标
        item.i = (Icons as any)[item[props.icon!]]
        // 处理sub-menu的插槽
        let slots = {
          title: () => {
            return <>
              <item.i />
              <span>{item[props.name]}</span>
            </>
          }
        }
        // 递归渲染children
        if (item[props.children!] && item[props.children!].length) {
          return (
            <el-sub-menu index={item[props.index]} v-slots={slots}>
              {renderMenu(item[props.children!])}
            </el-sub-menu>
          )
        }
        // 正常渲染普通的菜单
        return (
          <el-menu-item index={item[props.index]}>
            <item.i />
            <span>{item[props.name]}</span>
          </el-menu-item>
        )
      })
    }
    let attrs = useAttrs()
    return () => {
      return (
        <el-menu
          class="menu-icon-svg"
          default-active={props.defaultActive}
          router={props.router}
          {...attrs}
        >
          {renderMenu(props.data)}
        </el-menu>
      )
    }
  }
})

styles/index.scss

scss
.menu-icon-svg {
  svg {
    margin-right: 4px;
    width: 1em;
    height: 1em;
  }
}

views/menu/index.vue

html
<template>
  <div style="display: flex;">
    <div style="flex:1;">
      <m-menu :data="data1" defaultActive="1" name="a" index="b" icon="c" children="d"></m-menu>
    </div>
    <div style="flex:1;">
      <m-infinite-menu :data="data2" defaultActive="2" name="a" index="b" icon="c" children="d"></m-infinite-menu>
    </div>
  </div>
</template>

<script lang='ts' setup>
let data1 = [
  {
    a: '导航1',
    b: '1',
    c: 'Document'
  },
  {
    a: '导航2',
    b: '2',
    c: 'Document'
  },
  {
    a: '导航3',
    b: '3',
    c: 'Document',
    d: [
      {
        a: '导航3-1',
        b: '3-1',
        c: 'Document',
      }
    ]
  }
]
let data2 = [
  {
    a: '导航1',
    b: '1',
    c: 'Document'
  },
  {
    a: '导航2',
    b: '2',
    c: 'Document'
  },
  {
    a: '导航3',
    b: '3',
    c: 'Document',
    d: [
      {
        a: '导航3-1',
        b: '3-1',
        c: 'Document',
        d: [
          {
            a: '导航3-1-1',
            b: '3-1-1',
            c: 'Document',
            d: [
              {
                a: '导航3-1-1-1',
                b: '3-1-1-1',
                c: 'Document',
                d: [
                  {
                    a: '导航3-1-1-1-1',
                    b: '3-1-1-1-1',
                    c: 'Document',
                  }
                ]
              }
            ]
          }
        ]
      }
    ]
  }
]
</script>

<style lang='scss' scoped>
</style>

进度条-完成进度条动态加载效果

components/progress/src/index.vue

html
<template>
  <el-progress :percentage="p" v-bind="$attrs"></el-progress>
</template>

<script lang="ts" setup>
import { onMounted, ref } from "vue";

const props = defineProps({
  percentage: {
    type: Number,
    required: true,
  },
  isAnimate: {
    type: Boolean,
    default: false,
  },
  time: {
    type: Number,
    default: 3000,
  },
});

const p = ref(0);

onMounted(() => {
  if (props.isAnimate) {
    const t = Math.ceil(props.time / props.percentage);
    const timer = setInterval(() => {
      p.value += 1;
      if (p.value >= props.percentage) {
        p.value = props.percentage;
        clearInterval(timer);
      }
    }, t);
  } else {
    p.value = props.percentage;
  }
});
</script>

<style lang="scss" scoped>
svg {
  width: 126px;
  height: 126px;
}
</style>

views/progress/index.vue

html
<template>
  <div>
    <m-progress isAnimate :percentage="60"></m-progress>
    <br />
    <m-progress
      isAnimate
      status="success"
      :stroke-width="20"
      :percentage="60"
    ></m-progress>
    <br />
    <m-progress
      :time="5000"
      type="circle"
      isAnimate
      :percentage="60"
    ></m-progress>
  </div>
</template>

<script lang="ts" setup></script>

<style lang="scss" scoped></style>

时间选择组件-完成时间选择组件的全部功能

components/chooseTime/src/index.vue

html
<template>
  <div style="display: flex">
    <div style="margin-right: 20px">
      <el-time-select
        v-model="startTime"
        :placeholder="startPlaceholder"
        :start="startTimeStart"
        :step="startStep"
        :end="startTimeEnd"
        v-bind="$attrs.startOptions"
      ></el-time-select>
    </div>
    <div>
      <el-time-select
        v-model="endTime"
        :min-time="startTime"
        :placeholder="endPlaceholder"
        :start="endTimeStart"
        :step="endStep"
        :end="endTimeEnd"
        :disabled="endTimeDisabled"
        v-bind="$attrs.endOptions"
      ></el-time-select>
    </div>
  </div>
</template>

<script lang="ts" setup>
import { ref, watch } from "vue";

defineProps({
  // 开始时间的占位符
  startPlaceholder: {
    type: String,
    default: "请选择开始时间",
  },
  // 结束时间的占位符
  endPlaceholder: {
    type: String,
    default: "请选择结束时间",
  },
  // 开始时间的开始选择
  startTimeStart: {
    type: String,
    default: "08:00",
  },
  // 开始时间的步进
  startStep: {
    type: String,
    default: "00:30",
  },
  // 开始时间的结束选择
  startTimeEnd: {
    type: String,
    default: "24:00",
  },
  // 结束时间的开始选择
  endTimeStart: {
    type: String,
    default: "08:00",
  },
  // 结束时间的步进
  endStep: {
    type: String,
    default: "00:30",
  },
  // 结束时间的结束选择
  endTimeEnd: {
    type: String,
    default: "24:00",
  },
});

const emits = defineEmits(["startChange", "endChange"]);

// 开始时间
const startTime = ref<string>("");
// 结束时间
const endTime = ref<string>("");
// 是否禁用结束时间
const endTimeDisabled = ref<boolean>(true);

// 监听开始时间的变化
watch(
  () => startTime.value,
  (val) => {
    if (val === "" || !val) {
      endTime.value = "";
      endTimeDisabled.value = true;
    } else {
      endTimeDisabled.value = false;
      // 给父组件分发事件
      emits("startChange", val);
    }
  }
);

// 监听结束时间的变化
watch(
  () => endTime.value,
  (val) => {
    if (val !== "") {
      emits("endChange", {
        startTime: startTime.value,
        endTime: val,
      });
    }
  }
);
</script>

<style lang="scss" scoped>
.el-select {
  width: 200px;
}
</style>

views/chooseTime/index.vue

html
<template>
  <div>
    <m-choose-time
      :startOptions="startOptions"
      @startChange="startChange"
      @endChange="endChange"
    ></m-choose-time>
  </div>
</template>

<script lang="ts" setup>
interface endValue {
  startTime: string;
  endTime: string;
}
const startChange = (val: string) => {
  console.log("startChange", val);
};
const endChange = (val: endValue) => {
  console.log("endChange", val);
};
const startOptions = {
  size: "mini",
  clearable: false,
};
</script>

<style lang="scss" scoped></style>

时间选择组件-完成日期选择组件所有功能

components/chooseDate/src/index.vue

html
<template>
  <div style="display: flex">
    <div style="margin-right: 20px">
      <el-date-picker
        v-model="startDate"
        type="date"
        :placeholder="startPlaceholder"
        :disabledDate="startDisabledDate"
        v-bind="$attrs.startOptions"
      ></el-date-picker>
    </div>
    <div>
      <el-date-picker
        v-model="endDate"
        type="date"
        :placeholder="endPlaceholder"
        :disabled="endDateDisabled"
        :disabledDate="endDisabledDate"
        v-bind="$attrs.endOptions"
      ></el-date-picker>
    </div>
  </div>
</template>

<script lang="ts" setup>
import { ref, watch } from "vue";

const props = defineProps({
  // 开始日期的占位符
  startPlaceholder: {
    type: String,
    default: "请选择开始日期",
  },
  // 结束日期的占位符
  endPlaceholder: {
    type: String,
    default: "请选择结束日期",
  },
  // 是否禁用选择今天之前的日期
  disbaleToday: {
    type: Boolean,
    default: true,
  },
});

const emits = defineEmits(["startChange", "endChange"]);

// 开始日期
const startDate = ref<Date | null>(null);
// 结束日期
const endDate = ref<Date | null>(null);
// 控制结束日期的禁用状态
const endDateDisabled = ref<boolean>(true);

// 禁用开始日期的函数
const startDisabledDate = (time: Date) => {
  if (props.disbaleToday)
    return time.getTime() < Date.now() - 1000 * 60 * 60 * 24;
};
// 禁用结束日期的函数
const endDisabledDate = (time: Date) => {
  if (startDate.value) {
    return time.getTime() < startDate.value.getTime() + 1000 * 60 * 60 * 24;
  }
};

// 监听开始的日期
watch(
  () => startDate.value,
  (val) => {
    if (!val) {
      endDateDisabled.value = true;
      endDate.value = null;
    } else {
      emits("startChange", val);
      endDateDisabled.value = false;
    }
  }
);
// 监听结束的日期
watch(
  () => endDate.value,
  (val) => {
    if (val) {
      emits("endChange", {
        startDate: startDate.value,
        endDate: val,
      });
    }
  }
);
</script>

<style lang="scss" scoped></style>

views/chooseTime/index.vue

html
<template>
  <div>
    <m-choose-time
      :startOptions="startOptions"
      @startChange="startChange"
      @endChange="endChange"
    ></m-choose-time>
    <br />
    <br />
    <m-choose-date
      :disbaleToday="false"
      :startOptions="startOptions"
      @startChange="dateStartChange"
      @endChange="dateEndChange"
    ></m-choose-date>
  </div>
</template>

<script lang="ts" setup>
interface endValue {
  startTime: string;
  endTime: string;
}
interface dateEndValue {
  startDate: Date;
  endDate: Date;
}
const startChange = (val: string) => {
  console.log("startChange", val);
};
const endChange = (val: endValue) => {
  console.log("endChange", val);
};
const dateStartChange = (val: Date) => {
  console.log(val);
};
const dateEndChange = (val: dateEndValue) => {
  console.log(val);
};
const startOptions = {
  // size: 'mini',
  // clearable: false
};
</script>

<style lang="scss" scoped></style>

城市选择组件

html
<template>
  <el-popover v-model:visible="visible" placement="bottom-start" :width="430" trigger="click">
    <template #reference>
      <div class="result">
        <div>{{ result }}</div>
        <div>
          <el-icon-arrowdown :class="{ 'rotate': visible }"></el-icon-arrowdown>
        </div>
      </div>
    </template>
    <div class="container">
      <el-row>
        <el-col :span="8">
          <el-radio-group v-model="radioValue" size="small">
            <el-radio-button label="按城市"></el-radio-button>
            <el-radio-button label="按省份"></el-radio-button>
          </el-radio-group>
        </el-col>
        <el-col :offset="1" :span="15">
          <el-select
            @change="changeSelect"
            placeholder="请搜索城市"
            size="small"
            v-model="selectValue"
            filterable
            :filter-method="filterMethod"
          >
            <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id"></el-option>
          </el-select>
        </el-col>
      </el-row>
      <template v-if="radioValue === '按城市'">
        <div class="city">
          <!--  <div v-for="(value, key) in cities">{{key}}</div> -->
          <!-- 字母区域 -->
          <div
            class="city-item"
            @click="clickChat(item)"
            v-for="(item, index) in Object.keys(cities)"
          >{{ item }}</div>
        </div>
        <el-scrollbar max-height="300px">
          <template v-for="(value, key) in cities" :key="key">
            <el-row style="margin-bottom: 10px;" :id="key">
              <el-col :span="2">{{ key }}:</el-col>
              <el-col :span="22" class="city-name">
                <div
                  @click="clickItem(item)"
                  class="city-name-item"
                  v-for="(item, index) in value"
                  :key="item.id"
                >
                  <div>{{ item.name }}</div>
                </div>
              </el-col>
            </el-row>
          </template>
        </el-scrollbar>
      </template>
      <template v-else>
        <div class="province">
          <div
            class="province-item"
            v-for="(item, index) in Object.keys(provinces)"
            :key="index"
            @click="clickChat(item)"
          >{{ item }}</div>
        </div>
        <el-scrollbar max-height="300px">
          <template v-for="(item, index) in Object.values(provinces)" :key="index">
            <template v-for="(item1, index1) in item" :key="index1">
              <el-row style="margin-bottom: 10px;" :id="item1.id">
                <el-col :span="3">{{ item1.name }}:</el-col>
                <el-col :span="21" class="province-name">
                  <div
                    class="province-name-item"
                    v-for="(item2, index2) in item1.data"
                    :key="index2"
                  >
                    <div @click="clickProvince(item2)">{{ item2 }}</div>
                  </div>
                </el-col>
              </el-row>
            </template>
          </template>
        </el-scrollbar>
      </template>
    </div>
  </el-popover>
</template>

<script lang='ts' setup>
import { ref, onMounted } from 'vue'
import city from '../lib/city'
import { City } from './types'
import province from '../lib/province.json'

// 分发事件
let emits = defineEmits(['changeCity', "changeProvince"])

// 最终选择的结果
let result = ref<string>('请选择')
// 控制弹出层的显示
let visible = ref<boolean>(false)
// 单选框的值 按城市还是按省份选择
let radioValue = ref<string>('按城市')
// 下拉框的值 搜索下拉框
let selectValue = ref<string>('')
// 下拉框显示城市的数据
let options = ref<City[]>([])
// 所有的城市数据
let cities = ref(city.cities)
// 所有省份的数据
let provinces = ref(province)
// 所有的城市数据
let allCity = ref<City[]>([])

// 点击每个城市
let clickItem = (item: City) => {
  // 给结果赋值
  result.value = item.name
  // 关闭弹出层
  visible.value = false
  emits('changeCity', item)
}
let clickProvince = (item: string) => {
  // 给结果赋值
  result.value = item
  // 关闭弹出层
  visible.value = false
  emits('changeProvince', item)
}

// 点击字母区域
let clickChat = (item: string) => {
  let el = document.getElementById(item)
  if (el) el.scrollIntoView()
}
// 自定义搜索过滤
let filterMethod = (val: string) => {
  let values = Object.values(cities.value).flat(2)
  if (val === '') {
    options.value = values
  } else {
    if (radioValue.value === '按城市') {
      // 中文和拼音一起过滤
      options.value = values.filter(item => {
        return item.name.includes(val) || item.spell.includes(val)
      })
    } else {
      // 中文过滤
      options.value = values.filter(item => {
        return item.name.includes(val)
      })
    }
  }
}
// 下拉框选择
let changeSelect = (val: number) => {
  let city = allCity.value.find(item => item.id === val)!
  result.value = city.name
  if (radioValue.value === '按城市') {
    emits('changeCity', city)
  } else {
    emits('changeProvince', city.name)
  }
}
onMounted(() => {
  // 获取下拉框的城市数据
  let values = Object.values(cities.value).flat(2)
  allCity.value = values
  options.value = values
})
</script>

<style lang='scss' scoped>
.result {
  display: flex;
  align-items: center;
  width: fit-content;
  cursor: pointer;
}
.rotate {
  transform: rotate(180deg);
}
svg {
  width: 1em;
  height: 1em;
  position: relative;
  top: 2px;
  margin-left: 4px;
  transition: all 0.25s linear;
}
.container {
  padding: 6px;
}
.city,
.province {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 10px;
  margin-bottom: 10px;
  &-item {
    padding: 3px 6px;
    margin-right: 8px;
    border: 1px solid #eee;
    margin-bottom: 8px;
    cursor: pointer;
  }
}
.city-name,
.province-name {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  .city-name-item,
  .province-name-item {
    margin-right: 6px;
    margin-bottom: 6px;
    cursor: pointer;
  }
}
</style>

types.ts

typescript
export interface City {
  id: number,
  // 拼音
  spell: string,
  // 名字
  name: string
}

export interface Province {
  name: string,
  data: string[],
  id?: string
}

lib/city.ts

城市

typescript
export default {
	"cities": {
		"A": [{
			"id": 56,
			"spell": "aba",
			"name": "阿坝"
		}, {
			"id": 57,
			"spell": "akesu",
			"name": "阿克苏"
		}, {
			"id": 58,
			"spell": "alashanmeng",
			"name": "阿拉善盟"
		}, {
			"id": 59,
			"spell": "aletai",
			"name": "阿勒泰"
		}, {
			"id": 60,
			"spell": "ali",
			"name": "阿里"
		}, {
			"id": 61,
			"spell": "ankang",
			"name": "安康"
		}, {
			"id": 62,
			"spell": "anqing",
			"name": "安庆"
		}, {
			"id": 63,
			"spell": "anshan",
			"name": "鞍山"
		}, {
			"id": 64,
			"spell": "anshun",
			"name": "安顺"
		}, {
			"id": 65,
			"spell": "anyang",
			"name": "安阳"
		}, {
			"id": 338,
			"spell": "acheng",
			"name": "阿城"
		}, {
			"id": 339,
			"spell": "anfu",
			"name": "安福"
		}, {
			"id": 340,
			"spell": "anji",
			"name": "安吉"
		}, {
			"id": 341,
			"spell": "anning",
			"name": "安宁"
		}, {
			"id": 342,
			"spell": "anqiu",
			"name": "安丘"
		}, {
			"id": 343,
			"spell": "anxi",
			"name": "安溪"
		}, {
			"id": 344,
			"spell": "anyi",
			"name": "安义"
		}, {
			"id": 345,
			"spell": "anyuan",
			"name": "安远"
		}],
		"B": [{
			"id": 1,
			"spell": "beijing",
			"name": "北京"
		}, {
			"id": 66,
			"spell": "baicheng",
			"name": "白城"
		}, {
			"id": 67,
			"spell": "baise",
			"name": "百色"
		}, {
			"id": 68,
			"spell": "baishan",
			"name": "白山"
		}, {
			"id": 69,
			"spell": "baiyin",
			"name": "白银"
		}, {
			"id": 70,
			"spell": "bangbu",
			"name": "蚌埠"
		}, {
			"id": 71,
			"spell": "baoding",
			"name": "保定"
		}, {
			"id": 72,
			"spell": "baoji",
			"name": "宝鸡"
		}, {
			"id": 73,
			"spell": "baoshan",
			"name": "保山"
		}, {
			"id": 74,
			"spell": "baotou",
			"name": "包头"
		}, {
			"id": 75,
			"spell": "bayannaoer",
			"name": "巴彦淖尔"
		}, {
			"id": 76,
			"spell": "bayinguoleng",
			"name": "巴音郭楞"
		}, {
			"id": 77,
			"spell": "bazhong",
			"name": "巴中"
		}, {
			"id": 78,
			"spell": "beihai",
			"name": "北海"
		}, {
			"id": 79,
			"spell": "benxi",
			"name": "本溪"
		}, {
			"id": 80,
			"spell": "bijie",
			"name": "毕节"
		}, {
			"id": 81,
			"spell": "binzhou",
			"name": "滨州"
		}, {
			"id": 82,
			"spell": "boertala",
			"name": "博尔塔拉"
		}, {
			"id": 83,
			"spell": "bozhou",
			"name": "亳州"
		}, {
			"id": 346,
			"spell": "baoying",
			"name": "宝应"
		}, {
			"id": 347,
			"spell": "bayan",
			"name": "巴彦"
		}, {
			"id": 348,
			"spell": "binhai",
			"name": "滨海"
		}, {
			"id": 349,
			"spell": "binxian",
			"name": "宾县"
		}, {
			"id": 350,
			"spell": "binyang",
			"name": "宾阳"
		}, {
			"id": 351,
			"spell": "bishan",
			"name": "璧山"
		}, {
			"id": 352,
			"spell": "boai",
			"name": "博爱"
		}, {
			"id": 353,
			"spell": "boluo",
			"name": "博罗"
		}, {
			"id": 354,
			"spell": "boxing",
			"name": "博兴"
		}],
		"C": [{
			"id": 2,
			"spell": "chongqing",
			"name": "重庆"
		}, {
			"id": 5,
			"spell": "changchun",
			"name": "长春"
		}, {
			"id": 6,
			"spell": "changsha",
			"name": "长沙"
		}, {
			"id": 7,
			"spell": "changzhou",
			"name": "常州"
		}, {
			"id": 8,
			"spell": "chengdu",
			"name": "成都"
		}, {
			"id": 84,
			"spell": "cangzhou",
			"name": "沧州"
		}, {
			"id": 85,
			"spell": "changde",
			"name": "常德"
		}, {
			"id": 86,
			"spell": "changdu",
			"name": "昌都"
		}, {
			"id": 87,
			"spell": "changji",
			"name": "昌吉"
		}, {
			"id": 88,
			"spell": "changzhi",
			"name": "长治"
		}, {
			"id": 89,
			"spell": "chaohu",
			"name": "巢湖"
		}, {
			"id": 90,
			"spell": "chaoyang",
			"name": "朝阳"
		}, {
			"id": 91,
			"spell": "chaozhou",
			"name": "潮州"
		}, {
			"id": 92,
			"spell": "chengde",
			"name": "承德"
		}, {
			"id": 93,
			"spell": "chenzhou",
			"name": "郴州"
		}, {
			"id": 94,
			"spell": "chifeng",
			"name": "赤峰"
		}, {
			"id": 95,
			"spell": "chizhou",
			"name": "池州"
		}, {
			"id": 96,
			"spell": "chongzuo",
			"name": "崇左"
		}, {
			"id": 97,
			"spell": "chuxiong",
			"name": "楚雄"
		}, {
			"id": 98,
			"spell": "chuzhou",
			"name": "滁州"
		}, {
			"id": 355,
			"spell": "cangnan",
			"name": "苍南"
		}, {
			"id": 356,
			"spell": "cangshan",
			"name": "苍山"
		}, {
			"id": 357,
			"spell": "caoxian",
			"name": "曹县"
		}, {
			"id": 358,
			"spell": "changdao",
			"name": "长岛"
		}, {
			"id": 359,
			"spell": "changfeng",
			"name": "长丰"
		}, {
			"id": 360,
			"spell": "changhai",
			"name": "长海"
		}, {
			"id": 361,
			"spell": "changle",
			"name": "长乐"
		}, {
			"id": 362,
			"spell": "changle",
			"name": "昌乐"
		}, {
			"id": 363,
			"spell": "changshan",
			"name": "常山"
		}, {
			"id": 364,
			"spell": "changshu",
			"name": "常熟"
		}, {
			"id": 365,
			"spell": "changtai",
			"name": "长泰"
		}, {
			"id": 366,
			"spell": "changting",
			"name": "长汀"
		}, {
			"id": 367,
			"spell": "changxing",
			"name": "长兴"
		}, {
			"id": 368,
			"spell": "changyi",
			"name": "昌邑"
		}, {
			"id": 369,
			"spell": "chaoan",
			"name": "潮安"
		}, {
			"id": 370,
			"spell": "chenggong",
			"name": "呈贡"
		}, {
			"id": 371,
			"spell": "chengkou",
			"name": "城口"
		}, {
			"id": 372,
			"spell": "chengwu",
			"name": "成武"
		}, {
			"id": 373,
			"spell": "chiping",
			"name": "茌平"
		}, {
			"id": 374,
			"spell": "chongren",
			"name": "崇仁"
		}, {
			"id": 375,
			"spell": "chongyi",
			"name": "崇义"
		}, {
			"id": 376,
			"spell": "chongzhou",
			"name": "崇州"
		}, {
			"id": 377,
			"spell": "chunan",
			"name": "淳安"
		}, {
			"id": 378,
			"spell": "cixi",
			"name": "慈溪"
		}, {
			"id": 379,
			"spell": "conghua",
			"name": "从化"
		}, {
			"id": 380,
			"spell": "congyang",
			"name": "枞阳"
		}],
		"D": [{
			"id": 9,
			"spell": "dalian",
			"name": "大连"
		}, {
			"id": 10,
			"spell": "dongguan",
			"name": "东莞"
		}, {
			"id": 99,
			"spell": "dali",
			"name": "大理"
		}, {
			"id": 100,
			"spell": "dandong",
			"name": "丹东"
		}, {
			"id": 101,
			"spell": "daqing",
			"name": "大庆"
		}, {
			"id": 102,
			"spell": "datong",
			"name": "大同"
		}, {
			"id": 103,
			"spell": "daxinganling",
			"name": "大兴安岭"
		}, {
			"id": 104,
			"spell": "dazhou",
			"name": "达州"
		}, {
			"id": 105,
			"spell": "dehong",
			"name": "德宏"
		}, {
			"id": 106,
			"spell": "deyang",
			"name": "德阳"
		}, {
			"id": 107,
			"spell": "dezhou",
			"name": "德州"
		}, {
			"id": 108,
			"spell": "dingxi",
			"name": "定西"
		}, {
			"id": 109,
			"spell": "diqing",
			"name": "迪庆"
		}, {
			"id": 110,
			"spell": "dongying",
			"name": "东营"
		}, {
			"id": 381,
			"spell": "dafeng",
			"name": "大丰"
		}, {
			"id": 382,
			"spell": "daishan",
			"name": "岱山"
		}, {
			"id": 383,
			"spell": "dangshan",
			"name": "砀山"
		}, {
			"id": 384,
			"spell": "dangtu",
			"name": "当涂"
		}, {
			"id": 385,
			"spell": "danxian",
			"name": "单县"
		}, {
			"id": 386,
			"spell": "danyang",
			"name": "丹阳"
		}, {
			"id": 387,
			"spell": "dapu",
			"name": "大埔"
		}, {
			"id": 388,
			"spell": "datian",
			"name": "大田"
		}, {
			"id": 389,
			"spell": "dayi",
			"name": "大邑"
		}, {
			"id": 390,
			"spell": "dayu",
			"name": "大余"
		}, {
			"id": 391,
			"spell": "dazu",
			"name": "大足"
		}, {
			"id": 392,
			"spell": "dean",
			"name": "德安"
		}, {
			"id": 393,
			"spell": "dehua",
			"name": "德化"
		}, {
			"id": 394,
			"spell": "dehui",
			"name": "德惠"
		}, {
			"id": 395,
			"spell": "dengfeng",
			"name": "登封"
		}, {
			"id": 396,
			"spell": "deqing",
			"name": "德清"
		}, {
			"id": 397,
			"spell": "deqing",
			"name": "德庆"
		}, {
			"id": 398,
			"spell": "dexing",
			"name": "德兴"
		}, {
			"id": 399,
			"spell": "dianbai",
			"name": "电白"
		}, {
			"id": 400,
			"spell": "dianjiang",
			"name": "垫江"
		}, {
			"id": 401,
			"spell": "dingnan",
			"name": "定南"
		}, {
			"id": 402,
			"spell": "dingtao",
			"name": "定陶"
		}, {
			"id": 403,
			"spell": "dingyuan",
			"name": "定远"
		}, {
			"id": 404,
			"spell": "donga",
			"name": "东阿"
		}, {
			"id": 405,
			"spell": "donghai",
			"name": "东海"
		}, {
			"id": 406,
			"spell": "dongming",
			"name": "东明"
		}, {
			"id": 407,
			"spell": "dongping",
			"name": "东平"
		}, {
			"id": 408,
			"spell": "dongshan",
			"name": "东山"
		}, {
			"id": 409,
			"spell": "dongtai",
			"name": "东台"
		}, {
			"id": 410,
			"spell": "dongtou",
			"name": "洞头"
		}, {
			"id": 411,
			"spell": "dongxiang",
			"name": "东乡"
		}, {
			"id": 412,
			"spell": "dongyang",
			"name": "东阳"
		}, {
			"id": 413,
			"spell": "dongyuan",
			"name": "东源"
		}, {
			"id": 414,
			"spell": "dongzhi",
			"name": "东至"
		}, {
			"id": 415,
			"spell": "duchang",
			"name": "都昌"
		}, {
			"id": 416,
			"spell": "dujiangyan",
			"name": "都江堰"
		}],
		"E": [{
			"id": 111,
			"spell": "eerduosi",
			"name": "鄂尔多斯"
		}, {
			"id": 112,
			"spell": "enshi",
			"name": "恩施"
		}, {
			"id": 113,
			"spell": "ezhou",
			"name": "鄂州"
		}, {
			"id": 417,
			"spell": "enping",
			"name": "恩平"
		}],
		"F": [{
			"id": 11,
			"spell": "foshan",
			"name": "佛山"
		}, {
			"id": 12,
			"spell": "fuzhou",
			"name": "福州"
		}, {
			"id": 114,
			"spell": "fangchenggang",
			"name": "防城港"
		}, {
			"id": 115,
			"spell": "fushun",
			"name": "抚顺"
		}, {
			"id": 116,
			"spell": "fuxin",
			"name": "阜新"
		}, {
			"id": 117,
			"spell": "fuyang",
			"name": "阜阳"
		}, {
			"id": 118,
			"spell": "fuzhou",
			"name": "抚州"
		}, {
			"id": 418,
			"spell": "faku",
			"name": "法库"
		}, {
			"id": 419,
			"spell": "fanchang",
			"name": "繁昌"
		}, {
			"id": 420,
			"spell": "fangzheng",
			"name": "方正"
		}, {
			"id": 421,
			"spell": "feicheng",
			"name": "肥城"
		}, {
			"id": 422,
			"spell": "feidong",
			"name": "肥东"
		}, {
			"id": 423,
			"spell": "feixi",
			"name": "肥西"
		}, {
			"id": 424,
			"spell": "feixian",
			"name": "费县"
		}, {
			"id": 425,
			"spell": "fengcheng",
			"name": "丰城"
		}, {
			"id": 426,
			"spell": "fengdu",
			"name": "丰都"
		}, {
			"id": 427,
			"spell": "fenghua",
			"name": "奉化"
		}, {
			"id": 428,
			"spell": "fengjie",
			"name": "奉节"
		}, {
			"id": 429,
			"spell": "fengkai",
			"name": "封开"
		}, {
			"id": 430,
			"spell": "fengshun",
			"name": "丰顺"
		}, {
			"id": 431,
			"spell": "fengtai",
			"name": "凤台"
		}, {
			"id": 432,
			"spell": "fengxian",
			"name": "丰县"
		}, {
			"id": 433,
			"spell": "fengxin",
			"name": "奉新"
		}, {
			"id": 434,
			"spell": "fengyang",
			"name": "凤阳"
		}, {
			"id": 435,
			"spell": "fenyi",
			"name": "分宜"
		}, {
			"id": 436,
			"spell": "fogang",
			"name": "佛冈"
		}, {
			"id": 437,
			"spell": "fuan",
			"name": "福安"
		}, {
			"id": 438,
			"spell": "fuding",
			"name": "福鼎"
		}, {
			"id": 439,
			"spell": "fuliang",
			"name": "浮梁"
		}, {
			"id": 440,
			"spell": "fumin",
			"name": "富民"
		}, {
			"id": 441,
			"spell": "funan",
			"name": "阜南"
		}, {
			"id": 442,
			"spell": "funing",
			"name": "阜宁"
		}, {
			"id": 443,
			"spell": "fuqing",
			"name": "福清"
		}, {
			"id": 444,
			"spell": "fuyang",
			"name": "富阳"
		}],
		"G": [{
			"id": 13,
			"spell": "guangzhou",
			"name": "广州"
		}, {
			"id": 14,
			"spell": "guiyang",
			"name": "贵阳"
		}, {
			"id": 119,
			"spell": "gannan",
			"name": "甘南"
		}, {
			"id": 120,
			"spell": "ganzhou",
			"name": "赣州"
		}, {
			"id": 121,
			"spell": "ganzi",
			"name": "甘孜"
		}, {
			"id": 122,
			"spell": "guangan",
			"name": "广安"
		}, {
			"id": 123,
			"spell": "guangyuan",
			"name": "广元"
		}, {
			"id": 124,
			"spell": "guigang",
			"name": "贵港"
		}, {
			"id": 125,
			"spell": "guilin",
			"name": "桂林"
		}, {
			"id": 126,
			"spell": "guoluo",
			"name": "果洛"
		}, {
			"id": 127,
			"spell": "guyuan",
			"name": "固原"
		}, {
			"id": 445,
			"spell": "ganxian",
			"name": "赣县"
		}, {
			"id": 446,
			"spell": "ganyu",
			"name": "赣榆"
		}, {
			"id": 447,
			"spell": "gaoan",
			"name": "高安"
		}, {
			"id": 448,
			"spell": "gaocheng",
			"name": "藁城"
		}, {
			"id": 449,
			"spell": "gaochun",
			"name": "高淳"
		}, {
			"id": 450,
			"spell": "gaolan",
			"name": "皋兰"
		}, {
			"id": 451,
			"spell": "gaoling",
			"name": "高陵"
		}, {
			"id": 452,
			"spell": "gaomi",
			"name": "高密"
		}, {
			"id": 453,
			"spell": "gaoqing",
			"name": "高青"
		}, {
			"id": 454,
			"spell": "gaotang",
			"name": "高唐"
		}, {
			"id": 455,
			"spell": "gaoyao",
			"name": "高要"
		}, {
			"id": 456,
			"spell": "gaoyi",
			"name": "高邑"
		}, {
			"id": 457,
			"spell": "gaoyou",
			"name": "高邮"
		}, {
			"id": 458,
			"spell": "gaozhou",
			"name": "高州"
		}, {
			"id": 459,
			"spell": "gongyi",
			"name": "巩义"
		}, {
			"id": 460,
			"spell": "guangchang",
			"name": "广昌"
		}, {
			"id": 461,
			"spell": "guangde",
			"name": "广德"
		}, {
			"id": 462,
			"spell": "guangfeng",
			"name": "广丰"
		}, {
			"id": 463,
			"spell": "guangning",
			"name": "广宁"
		}, {
			"id": 464,
			"spell": "guangrao",
			"name": "广饶"
		}, {
			"id": 465,
			"spell": "guangze",
			"name": "光泽"
		}, {
			"id": 466,
			"spell": "guannan",
			"name": "灌南"
		}, {
			"id": 467,
			"spell": "guanxian",
			"name": "冠县"
		}, {
			"id": 468,
			"spell": "guanyun",
			"name": "灌云"
		}, {
			"id": 469,
			"spell": "guixi",
			"name": "贵溪"
		}, {
			"id": 470,
			"spell": "gutian",
			"name": "古田"
		}, {
			"id": 471,
			"spell": "guzhen",
			"name": "固镇"
		}],
		"H": [{
			"id": 15,
			"spell": "haerbin",
			"name": "哈尔滨"
		}, {
			"id": 16,
			"spell": "haikou",
			"name": "海口"
		}, {
			"id": 17,
			"spell": "handan",
			"name": "邯郸"
		}, {
			"id": 18,
			"spell": "hangzhou",
			"name": "杭州"
		}, {
			"id": 19,
			"spell": "hefei",
			"name": "合肥"
		}, {
			"id": 20,
			"spell": "huizhou",
			"name": "惠州"
		}, {
			"id": 128,
			"spell": "haibei",
			"name": "海北"
		}, {
			"id": 129,
			"spell": "haidong",
			"name": "海东"
		}, {
			"id": 130,
			"spell": "hainan",
			"name": "海南"
		}, {
			"id": 131,
			"spell": "haixi",
			"name": "海西"
		}, {
			"id": 132,
			"spell": "hami",
			"name": "哈密"
		}, {
			"id": 133,
			"spell": "hanzhong",
			"name": "汉中"
		}, {
			"id": 134,
			"spell": "hebi",
			"name": "鹤壁"
		}, {
			"id": 135,
			"spell": "hechi",
			"name": "河池"
		}, {
			"id": 136,
			"spell": "hegang",
			"name": "鹤岗"
		}, {
			"id": 137,
			"spell": "heihe",
			"name": "黑河"
		}, {
			"id": 138,
			"spell": "hengshui",
			"name": "衡水"
		}, {
			"id": 139,
			"spell": "hengyang",
			"name": "衡阳"
		}, {
			"id": 140,
			"spell": "hetiandi",
			"name": "和田地"
		}, {
			"id": 141,
			"spell": "heyuan",
			"name": "河源"
		}, {
			"id": 142,
			"spell": "heze",
			"name": "菏泽"
		}, {
			"id": 143,
			"spell": "hezhou",
			"name": "贺州"
		}, {
			"id": 144,
			"spell": "honghe",
			"name": "红河"
		}, {
			"id": 145,
			"spell": "huaian",
			"name": "淮安"
		}, {
			"id": 146,
			"spell": "huaibei",
			"name": "淮北"
		}, {
			"id": 147,
			"spell": "huaihua",
			"name": "怀化"
		}, {
			"id": 148,
			"spell": "huainan",
			"name": "淮南"
		}, {
			"id": 149,
			"spell": "huanggang",
			"name": "黄冈"
		}, {
			"id": 150,
			"spell": "huangnan",
			"name": "黄南"
		}, {
			"id": 151,
			"spell": "huangshan",
			"name": "黄山"
		}, {
			"id": 152,
			"spell": "huangshi",
			"name": "黄石"
		}, {
			"id": 153,
			"spell": "huhehaote",
			"name": "呼和浩特"
		}, {
			"id": 154,
			"spell": "huludao",
			"name": "葫芦岛"
		}, {
			"id": 155,
			"spell": "hulunbeier",
			"name": "呼伦贝尔"
		}, {
			"id": 156,
			"spell": "huzhou",
			"name": "湖州"
		}, {
			"id": 472,
			"spell": "haian",
			"name": "海安"
		}, {
			"id": 473,
			"spell": "haifeng",
			"name": "海丰"
		}, {
			"id": 474,
			"spell": "haimen",
			"name": "海门"
		}, {
			"id": 475,
			"spell": "haining",
			"name": "海宁"
		}, {
			"id": 476,
			"spell": "haiyan",
			"name": "海盐"
		}, {
			"id": 477,
			"spell": "haiyang",
			"name": "海阳"
		}, {
			"id": 478,
			"spell": "hanshan",
			"name": "含山"
		}, {
			"id": 479,
			"spell": "hechuan",
			"name": "合川"
		}, {
			"id": 480,
			"spell": "hengfeng",
			"name": "横峰"
		}, {
			"id": 481,
			"spell": "hengxian",
			"name": "横县"
		}, {
			"id": 482,
			"spell": "heping",
			"name": "和平"
		}, {
			"id": 483,
			"spell": "heshan",
			"name": "鹤山"
		}, {
			"id": 484,
			"spell": "hexian",
			"name": "和县"
		}, {
			"id": 485,
			"spell": "hongze",
			"name": "洪泽"
		}, {
			"id": 486,
			"spell": "huaan",
			"name": "华安"
		}, {
			"id": 487,
			"spell": "huadian",
			"name": "桦甸"
		}, {
			"id": 488,
			"spell": "huaiji",
			"name": "怀集"
		}, {
			"id": 489,
			"spell": "huaining",
			"name": "怀宁"
		}, {
			"id": 490,
			"spell": "huaiyuan",
			"name": "怀远"
		}, {
			"id": 491,
			"spell": "huantai",
			"name": "桓台"
		}, {
			"id": 492,
			"spell": "huazhou",
			"name": "化州"
		}, {
			"id": 493,
			"spell": "huian",
			"name": "惠安"
		}, {
			"id": 494,
			"spell": "huichang",
			"name": "会昌"
		}, {
			"id": 495,
			"spell": "huidong",
			"name": "惠东"
		}, {
			"id": 496,
			"spell": "huilai",
			"name": "惠来"
		}, {
			"id": 497,
			"spell": "huimin",
			"name": "惠民"
		}, {
			"id": 498,
			"spell": "hukou",
			"name": "湖口"
		}, {
			"id": 499,
			"spell": "hulan",
			"name": "呼兰"
		}, {
			"id": 500,
			"spell": "huoqiu",
			"name": "霍邱"
		}, {
			"id": 501,
			"spell": "huoshan",
			"name": "霍山"
		}, {
			"id": 502,
			"spell": "huxian",
			"name": "户县"
		}],
		"J": [{
			"id": 21,
			"spell": "jiaozuo",
			"name": "焦作"
		}, {
			"id": 22,
			"spell": "jiaxing",
			"name": "嘉兴"
		}, {
			"id": 23,
			"spell": "jilin",
			"name": "吉林"
		}, {
			"id": 24,
			"spell": "jinan",
			"name": "济南"
		}, {
			"id": 157,
			"spell": "jiamusi",
			"name": "佳木斯"
		}, {
			"id": 158,
			"spell": "jiangmen",
			"name": "江门"
		}, {
			"id": 159,
			"spell": "jian",
			"name": "吉安"
		}, {
			"id": 160,
			"spell": "jiayuguan",
			"name": "嘉峪关"
		}, {
			"id": 161,
			"spell": "jieyang",
			"name": "揭阳"
		}, {
			"id": 162,
			"spell": "jinchang",
			"name": "金昌"
		}, {
			"id": 163,
			"spell": "jincheng",
			"name": "晋城"
		}, {
			"id": 164,
			"spell": "jingdezhen",
			"name": "景德镇"
		}, {
			"id": 165,
			"spell": "jingmen",
			"name": "荆门"
		}, {
			"id": 166,
			"spell": "jingzhou",
			"name": "荆州"
		}, {
			"id": 167,
			"spell": "jinhua",
			"name": "金华"
		}, {
			"id": 168,
			"spell": "jining",
			"name": "济宁"
		}, {
			"id": 169,
			"spell": "jinzhong",
			"name": "晋中"
		}, {
			"id": 170,
			"spell": "jinzhou",
			"name": "锦州"
		}, {
			"id": 171,
			"spell": "jiujiang",
			"name": "九江"
		}, {
			"id": 172,
			"spell": "jiuquan",
			"name": "酒泉"
		}, {
			"id": 173,
			"spell": "jixi",
			"name": "鸡西"
		}, {
			"id": 503,
			"spell": "jiande",
			"name": "建德"
		}, {
			"id": 504,
			"spell": "jiangdu",
			"name": "江都"
		}, {
			"id": 505,
			"spell": "jiangjin",
			"name": "江津"
		}, {
			"id": 506,
			"spell": "jiangle",
			"name": "将乐"
		}, {
			"id": 507,
			"spell": "jiangshan",
			"name": "江山"
		}, {
			"id": 508,
			"spell": "jiangyan",
			"name": "姜堰"
		}, {
			"id": 509,
			"spell": "jiangyin",
			"name": "江阴"
		}, {
			"id": 510,
			"spell": "jianhu",
			"name": "建湖"
		}, {
			"id": 511,
			"spell": "jianning",
			"name": "建宁"
		}, {
			"id": 512,
			"spell": "jianou",
			"name": "建瓯"
		}, {
			"id": 513,
			"spell": "jianyang",
			"name": "建阳"
		}, {
			"id": 514,
			"spell": "jian",
			"name": "吉安"
		}, {
			"id": 515,
			"spell": "jiaohe",
			"name": "蛟河"
		}, {
			"id": 516,
			"spell": "jiaoling",
			"name": "蕉岭"
		}, {
			"id": 517,
			"spell": "jiaonan",
			"name": "胶南"
		}, {
			"id": 518,
			"spell": "jiaozhou",
			"name": "胶州"
		}, {
			"id": 519,
			"spell": "jiashan",
			"name": "嘉善"
		}, {
			"id": 520,
			"spell": "jiaxiang",
			"name": "嘉祥"
		}, {
			"id": 521,
			"spell": "jiedong",
			"name": "揭东"
		}, {
			"id": 522,
			"spell": "jieshou",
			"name": "界首"
		}, {
			"id": 523,
			"spell": "jiexi",
			"name": "揭西"
		}, {
			"id": 524,
			"spell": "jimo",
			"name": "即墨"
		}, {
			"id": 525,
			"spell": "jingan",
			"name": "靖安"
		}, {
			"id": 526,
			"spell": "jingde",
			"name": "旌德"
		}, {
			"id": 527,
			"spell": "jinggangshan",
			"name": "井冈山"
		}, {
			"id": 528,
			"spell": "jingjiang",
			"name": "靖江"
		}, {
			"id": 529,
			"spell": "jingning",
			"name": "景宁"
		}, {
			"id": 530,
			"spell": "jingxian",
			"name": "泾县"
		}, {
			"id": 531,
			"spell": "jingxing",
			"name": "井陉"
		}, {
			"id": 532,
			"spell": "jinhu",
			"name": "金湖"
		}, {
			"id": 533,
			"spell": "jinjiang",
			"name": "晋江"
		}, {
			"id": 534,
			"spell": "jinmen",
			"name": "金门"
		}, {
			"id": 535,
			"spell": "jinning",
			"name": "晋宁"
		}, {
			"id": 536,
			"spell": "jintan",
			"name": "金坛"
		}, {
			"id": 537,
			"spell": "jintang",
			"name": "金堂"
		}, {
			"id": 538,
			"spell": "jinxian",
			"name": "进贤"
		}, {
			"id": 539,
			"spell": "jinxi",
			"name": "金溪"
		}, {
			"id": 540,
			"spell": "jinxiang",
			"name": "金乡"
		}, {
			"id": 541,
			"spell": "jinyun",
			"name": "缙云"
		}, {
			"id": 542,
			"spell": "jinzhai",
			"name": "金寨"
		}, {
			"id": 543,
			"spell": "jinzhou",
			"name": "晋州"
		}, {
			"id": 544,
			"spell": "jishui",
			"name": "吉水"
		}, {
			"id": 545,
			"spell": "jiujiang",
			"name": "九江"
		}, {
			"id": 546,
			"spell": "jiutai",
			"name": "九台"
		}, {
			"id": 547,
			"spell": "jixi",
			"name": "绩溪"
		}, {
			"id": 548,
			"spell": "jiyang",
			"name": "济阳"
		}, {
			"id": 549,
			"spell": "jiyuan",
			"name": "济源"
		}, {
			"id": 550,
			"spell": "juancheng",
			"name": "鄄城"
		}, {
			"id": 551,
			"spell": "junan",
			"name": "莒南"
		}, {
			"id": 552,
			"spell": "jurong",
			"name": "句容"
		}, {
			"id": 553,
			"spell": "juxian",
			"name": "莒县"
		}, {
			"id": 554,
			"spell": "juye",
			"name": "巨野"
		}],
		"K": [{
			"id": 25,
			"spell": "kunming",
			"name": "昆明"
		}, {
			"id": 174,
			"spell": "kaifeng",
			"name": "开封"
		}, {
			"id": 175,
			"spell": "kashidi",
			"name": "喀什地"
		}, {
			"id": 176,
			"spell": "kelamayi",
			"name": "克拉玛依"
		}, {
			"id": 177,
			"spell": "kezile",
			"name": "克孜勒"
		}, {
			"id": 555,
			"spell": "kaihua",
			"name": "开化"
		}, {
			"id": 556,
			"spell": "kaiping",
			"name": "开平"
		}, {
			"id": 557,
			"spell": "kaixian",
			"name": "开县"
		}, {
			"id": 558,
			"spell": "kaiyang",
			"name": "开阳"
		}, {
			"id": 559,
			"spell": "kangping",
			"name": "康平"
		}, {
			"id": 560,
			"spell": "kenli",
			"name": "垦利"
		}, {
			"id": 561,
			"spell": "kunshan",
			"name": "昆山"
		}],
		"L": [{
			"id": 26,
			"spell": "lanzhou",
			"name": "兰州"
		}, {
			"id": 27,
			"spell": "liuzhou",
			"name": "柳州"
		}, {
			"id": 28,
			"spell": "luoyang",
			"name": "洛阳"
		}, {
			"id": 178,
			"spell": "laibin",
			"name": "来宾"
		}, {
			"id": 179,
			"spell": "laiwu",
			"name": "莱芜"
		}, {
			"id": 180,
			"spell": "langfang",
			"name": "廊坊"
		}, {
			"id": 181,
			"spell": "lasa",
			"name": "拉萨"
		}, {
			"id": 182,
			"spell": "leshan",
			"name": "乐山"
		}, {
			"id": 183,
			"spell": "liangshan",
			"name": "凉山"
		}, {
			"id": 184,
			"spell": "lianyungang",
			"name": "连云港"
		}, {
			"id": 185,
			"spell": "liaocheng",
			"name": "聊城"
		}, {
			"id": 186,
			"spell": "liaoyang",
			"name": "辽阳"
		}, {
			"id": 187,
			"spell": "liaoyuan",
			"name": "辽源"
		}, {
			"id": 188,
			"spell": "lijiang",
			"name": "丽江"
		}, {
			"id": 189,
			"spell": "lincang",
			"name": "临沧"
		}, {
			"id": 190,
			"spell": "linfen",
			"name": "临汾"
		}, {
			"id": 191,
			"spell": "linxia",
			"name": "临夏"
		}, {
			"id": 192,
			"spell": "linyi",
			"name": "临沂"
		}, {
			"id": 193,
			"spell": "linzhi",
			"name": "林芝"
		}, {
			"id": 194,
			"spell": "lishui",
			"name": "丽水"
		}, {
			"id": 195,
			"spell": "liuan",
			"name": "六安"
		}, {
			"id": 196,
			"spell": "liupanshui",
			"name": "六盘水"
		}, {
			"id": 197,
			"spell": "longnan",
			"name": "陇南"
		}, {
			"id": 198,
			"spell": "longyan",
			"name": "龙岩"
		}, {
			"id": 199,
			"spell": "loudi",
			"name": "娄底"
		}, {
			"id": 200,
			"spell": "luohe",
			"name": "漯河"
		}, {
			"id": 201,
			"spell": "luzhou",
			"name": "泸州"
		}, {
			"id": 202,
			"spell": "lvliang",
			"name": "吕梁"
		}, {
			"id": 562,
			"spell": "laian",
			"name": "来安"
		}, {
			"id": 563,
			"spell": "laixi",
			"name": "莱西"
		}, {
			"id": 564,
			"spell": "laiyang",
			"name": "莱阳"
		}, {
			"id": 565,
			"spell": "laizhou",
			"name": "莱州"
		}, {
			"id": 566,
			"spell": "langxi",
			"name": "郎溪"
		}, {
			"id": 567,
			"spell": "lantian",
			"name": "蓝田"
		}, {
			"id": 568,
			"spell": "lanxi",
			"name": "兰溪"
		}, {
			"id": 569,
			"spell": "lean",
			"name": "乐安"
		}, {
			"id": 570,
			"spell": "lechang",
			"name": "乐昌"
		}, {
			"id": 571,
			"spell": "leizhou",
			"name": "雷州"
		}, {
			"id": 572,
			"spell": "leling",
			"name": "乐陵"
		}, {
			"id": 573,
			"spell": "leping",
			"name": "乐平"
		}, {
			"id": 574,
			"spell": "leqing",
			"name": "乐清"
		}, {
			"id": 575,
			"spell": "leting",
			"name": "乐亭"
		}, {
			"id": 576,
			"spell": "liancheng",
			"name": "连城"
		}, {
			"id": 577,
			"spell": "liangping",
			"name": "梁平"
		}, {
			"id": 578,
			"spell": "liangshan",
			"name": "梁山"
		}, {
			"id": 579,
			"spell": "lianhua",
			"name": "莲花"
		}, {
			"id": 580,
			"spell": "lianjiang",
			"name": "连江"
		}, {
			"id": 581,
			"spell": "lianjiang",
			"name": "廉江"
		}, {
			"id": 582,
			"spell": "liannan",
			"name": "连南"
		}, {
			"id": 583,
			"spell": "lianping",
			"name": "连平"
		}, {
			"id": 584,
			"spell": "lianshan",
			"name": "连山"
		}, {
			"id": 585,
			"spell": "lianshui",
			"name": "涟水"
		}, {
			"id": 586,
			"spell": "lianzhou",
			"name": "连州"
		}, {
			"id": 587,
			"spell": "liaozhong",
			"name": "辽中"
		}, {
			"id": 588,
			"spell": "lichuan",
			"name": "黎川"
		}, {
			"id": 589,
			"spell": "lijin",
			"name": "利津"
		}, {
			"id": 590,
			"spell": "linan",
			"name": "临安"
		}, {
			"id": 591,
			"spell": "lingbi",
			"name": "灵璧"
		}, {
			"id": 592,
			"spell": "lingshou",
			"name": "灵寿"
		}, {
			"id": 593,
			"spell": "lingxian",
			"name": "陵县"
		}, {
			"id": 594,
			"spell": "linhai",
			"name": "临海"
		}, {
			"id": 595,
			"spell": "linqing",
			"name": "临清"
		}, {
			"id": 596,
			"spell": "linquan",
			"name": "临泉"
		}, {
			"id": 597,
			"spell": "linqu",
			"name": "临朐"
		}, {
			"id": 598,
			"spell": "linshu",
			"name": "临沭"
		}, {
			"id": 599,
			"spell": "linyi",
			"name": "临邑"
		}, {
			"id": 600,
			"spell": "lishui",
			"name": "溧水"
		}, {
			"id": 601,
			"spell": "liucheng",
			"name": "柳城"
		}, {
			"id": 602,
			"spell": "liujiang",
			"name": "柳江"
		}, {
			"id": 603,
			"spell": "liuyang",
			"name": "浏阳"
		}, {
			"id": 604,
			"spell": "lixin",
			"name": "利辛"
		}, {
			"id": 605,
			"spell": "liyang",
			"name": "溧阳"
		}, {
			"id": 606,
			"spell": "longan",
			"name": "隆安"
		}, {
			"id": 607,
			"spell": "longchuan",
			"name": "龙川"
		}, {
			"id": 608,
			"spell": "longhai",
			"name": "龙海"
		}, {
			"id": 609,
			"spell": "longkou",
			"name": "龙口"
		}, {
			"id": 610,
			"spell": "longmen",
			"name": "龙门"
		}, {
			"id": 611,
			"spell": "longnan",
			"name": "龙南"
		}, {
			"id": 612,
			"spell": "longquan",
			"name": "龙泉"
		}, {
			"id": 613,
			"spell": "longyou",
			"name": "龙游"
		}, {
			"id": 614,
			"spell": "luancheng",
			"name": "栾城"
		}, {
			"id": 615,
			"spell": "luanchuan",
			"name": "栾川"
		}, {
			"id": 616,
			"spell": "luannan",
			"name": "滦南"
		}, {
			"id": 617,
			"spell": "luanxian",
			"name": "滦县"
		}, {
			"id": 618,
			"spell": "lufeng",
			"name": "陆丰"
		}, {
			"id": 619,
			"spell": "luhe",
			"name": "陆河"
		}, {
			"id": 620,
			"spell": "lujiang",
			"name": "庐江"
		}, {
			"id": 621,
			"spell": "luoding",
			"name": "罗定"
		}, {
			"id": 622,
			"spell": "luoning",
			"name": "洛宁"
		}, {
			"id": 623,
			"spell": "luoyuan",
			"name": "罗源"
		}, {
			"id": 624,
			"spell": "luquan",
			"name": "鹿泉"
		}, {
			"id": 625,
			"spell": "luquan",
			"name": "禄劝"
		}, {
			"id": 626,
			"spell": "luxi",
			"name": "芦溪"
		}, {
			"id": 627,
			"spell": "luzhai",
			"name": "鹿寨"
		}],
		"M": [{
			"id": 203,
			"spell": "maanshan",
			"name": "马鞍山"
		}, {
			"id": 204,
			"spell": "maoming",
			"name": "茂名"
		}, {
			"id": 205,
			"spell": "meishan",
			"name": "眉山"
		}, {
			"id": 206,
			"spell": "meizhou",
			"name": "梅州"
		}, {
			"id": 207,
			"spell": "mianyang",
			"name": "绵阳"
		}, {
			"id": 208,
			"spell": "mudanjiang",
			"name": "牡丹江"
		}, {
			"id": 628,
			"spell": "mashan",
			"name": "马山"
		}, {
			"id": 629,
			"spell": "meixian",
			"name": "梅县"
		}, {
			"id": 630,
			"spell": "mengcheng",
			"name": "蒙城"
		}, {
			"id": 631,
			"spell": "mengjin",
			"name": "孟津"
		}, {
			"id": 632,
			"spell": "mengyin",
			"name": "蒙阴"
		}, {
			"id": 633,
			"spell": "mengzhou",
			"name": "孟州"
		}, {
			"id": 634,
			"spell": "mingguang",
			"name": "明光"
		}, {
			"id": 635,
			"spell": "mingxi",
			"name": "明溪"
		}, {
			"id": 636,
			"spell": "minhou",
			"name": "闽侯"
		}, {
			"id": 637,
			"spell": "minqing",
			"name": "闽清"
		}, {
			"id": 638,
			"spell": "mulan",
			"name": "木兰"
		}],
		"N": [{
			"id": 29,
			"spell": "nanchang",
			"name": "南昌"
		}, {
			"id": 30,
			"spell": "nanjing",
			"name": "南京"
		}, {
			"id": 31,
			"spell": "nanning",
			"name": "南宁"
		}, {
			"id": 32,
			"spell": "nantong",
			"name": "南通"
		}, {
			"id": 33,
			"spell": "ningbo",
			"name": "宁波"
		}, {
			"id": 209,
			"spell": "nanchong",
			"name": "南充"
		}, {
			"id": 210,
			"spell": "nanping",
			"name": "南平"
		}, {
			"id": 211,
			"spell": "nanyang",
			"name": "南阳"
		}, {
			"id": 212,
			"spell": "naqu",
			"name": "那曲"
		}, {
			"id": 213,
			"spell": "neijiang",
			"name": "内江"
		}, {
			"id": 214,
			"spell": "ningde",
			"name": "宁德"
		}, {
			"id": 215,
			"spell": "nujiang",
			"name": "怒江"
		}, {
			"id": 639,
			"spell": "nanan",
			"name": "南安"
		}, {
			"id": 640,
			"spell": "nanao",
			"name": "南澳"
		}, {
			"id": 641,
			"spell": "nancheng",
			"name": "南城"
		}, {
			"id": 642,
			"spell": "nanchuan",
			"name": "南川"
		}, {
			"id": 643,
			"spell": "nanfeng",
			"name": "南丰"
		}, {
			"id": 644,
			"spell": "nanjing",
			"name": "南靖"
		}, {
			"id": 645,
			"spell": "nankang",
			"name": "南康"
		}, {
			"id": 646,
			"spell": "nanling",
			"name": "南陵"
		}, {
			"id": 647,
			"spell": "nanxiong",
			"name": "南雄"
		}, {
			"id": 648,
			"spell": "ningdu",
			"name": "宁都"
		}, {
			"id": 649,
			"spell": "ningguo",
			"name": "宁国"
		}, {
			"id": 650,
			"spell": "ninghai",
			"name": "宁海"
		}, {
			"id": 651,
			"spell": "ninghua",
			"name": "宁化"
		}, {
			"id": 652,
			"spell": "ningjin",
			"name": "宁津"
		}, {
			"id": 653,
			"spell": "ningxiang",
			"name": "宁乡"
		}, {
			"id": 654,
			"spell": "ningyang",
			"name": "宁阳"
		}, {
			"id": 655,
			"spell": "nongan",
			"name": "农安"
		}],
		"P": [{
			"id": 216,
			"spell": "panjin",
			"name": "盘锦"
		}, {
			"id": 217,
			"spell": "panzhihua",
			"name": "攀枝花"
		}, {
			"id": 218,
			"spell": "pingdingshan",
			"name": "平顶山"
		}, {
			"id": 219,
			"spell": "pingliang",
			"name": "平凉"
		}, {
			"id": 220,
			"spell": "pingxiang",
			"name": "萍乡"
		}, {
			"id": 221,
			"spell": "puer",
			"name": "普洱"
		}, {
			"id": 222,
			"spell": "putian",
			"name": "莆田"
		}, {
			"id": 223,
			"spell": "puyang",
			"name": "濮阳"
		}, {
			"id": 656,
			"spell": "panan",
			"name": "磐安"
		}, {
			"id": 657,
			"spell": "panshi",
			"name": "磐石"
		}, {
			"id": 658,
			"spell": "peixian",
			"name": "沛县"
		}, {
			"id": 659,
			"spell": "penglai",
			"name": "蓬莱"
		}, {
			"id": 660,
			"spell": "pengshui",
			"name": "彭水"
		}, {
			"id": 661,
			"spell": "pengze",
			"name": "彭泽"
		}, {
			"id": 662,
			"spell": "pengzhou",
			"name": "彭州"
		}, {
			"id": 663,
			"spell": "pingdu",
			"name": "平度"
		}, {
			"id": 664,
			"spell": "pinghe",
			"name": "平和"
		}, {
			"id": 665,
			"spell": "pinghu",
			"name": "平湖"
		}, {
			"id": 666,
			"spell": "pingnan",
			"name": "屏南"
		}, {
			"id": 667,
			"spell": "pingshan",
			"name": "平山"
		}, {
			"id": 668,
			"spell": "pingtan",
			"name": "平潭"
		}, {
			"id": 669,
			"spell": "pingyang",
			"name": "平阳"
		}, {
			"id": 670,
			"spell": "pingyin",
			"name": "平阴"
		}, {
			"id": 671,
			"spell": "pingyi",
			"name": "平邑"
		}, {
			"id": 672,
			"spell": "pingyuan",
			"name": "平原"
		}, {
			"id": 673,
			"spell": "pingyuan",
			"name": "平远"
		}, {
			"id": 674,
			"spell": "pixian",
			"name": "郫县"
		}, {
			"id": 675,
			"spell": "pizhou",
			"name": "邳州"
		}, {
			"id": 676,
			"spell": "poyang",
			"name": "鄱阳"
		}, {
			"id": 677,
			"spell": "pucheng",
			"name": "浦城"
		}, {
			"id": 678,
			"spell": "pujiang",
			"name": "浦江"
		}, {
			"id": 679,
			"spell": "pujiang",
			"name": "蒲江"
		}, {
			"id": 680,
			"spell": "pulandian",
			"name": "普兰店"
		}, {
			"id": 681,
			"spell": "puning",
			"name": "普宁"
		}],
		"Q": [{
			"id": 34,
			"spell": "qingdao",
			"name": "青岛"
		}, {
			"id": 35,
			"spell": "quanzhou",
			"name": "泉州"
		}, {
			"id": 224,
			"spell": "qiandong",
			"name": "黔东"
		}, {
			"id": 225,
			"spell": "qiannan",
			"name": "黔南"
		}, {
			"id": 226,
			"spell": "qianxinan",
			"name": "黔西南"
		}, {
			"id": 227,
			"spell": "qingyang",
			"name": "庆阳"
		}, {
			"id": 228,
			"spell": "qingyuan",
			"name": "清远"
		}, {
			"id": 229,
			"spell": "qinhuangdao",
			"name": "秦皇岛"
		}, {
			"id": 230,
			"spell": "qinzhou",
			"name": "钦州"
		}, {
			"id": 231,
			"spell": "qiqihaer",
			"name": "齐齐哈尔"
		}, {
			"id": 232,
			"spell": "qitaihe",
			"name": "七台河"
		}, {
			"id": 233,
			"spell": "qujing",
			"name": "曲靖"
		}, {
			"id": 234,
			"spell": "quzhou",
			"name": "衢州"
		}, {
			"id": 682,
			"spell": "qianan",
			"name": "迁安"
		}, {
			"id": 683,
			"spell": "qianshan",
			"name": "潜山"
		}, {
			"id": 684,
			"spell": "qianshan",
			"name": "铅山"
		}, {
			"id": 685,
			"spell": "qianxi",
			"name": "迁西"
		}, {
			"id": 686,
			"spell": "qidong",
			"name": "启东"
		}, {
			"id": 687,
			"spell": "qihe",
			"name": "齐河"
		}, {
			"id": 688,
			"spell": "qijiang",
			"name": "綦江"
		}, {
			"id": 689,
			"spell": "qimen",
			"name": "祁门"
		}, {
			"id": 690,
			"spell": "qingliu",
			"name": "清流"
		}, {
			"id": 691,
			"spell": "qingtian",
			"name": "青田"
		}, {
			"id": 692,
			"spell": "qingxin",
			"name": "清新"
		}, {
			"id": 693,
			"spell": "qingyang",
			"name": "青阳"
		}, {
			"id": 694,
			"spell": "qingyuan",
			"name": "庆元"
		}, {
			"id": 695,
			"spell": "qingyun",
			"name": "庆云"
		}, {
			"id": 696,
			"spell": "qingzhen",
			"name": "清镇"
		}, {
			"id": 697,
			"spell": "qingzhou",
			"name": "青州"
		}, {
			"id": 698,
			"spell": "qinyang",
			"name": "沁阳"
		}, {
			"id": 699,
			"spell": "qionglai",
			"name": "邛崃"
		}, {
			"id": 700,
			"spell": "qixia",
			"name": "栖霞"
		}, {
			"id": 701,
			"spell": "quanjiao",
			"name": "全椒"
		}, {
			"id": 702,
			"spell": "quannan",
			"name": "全南"
		}, {
			"id": 703,
			"spell": "qufu",
			"name": "曲阜"
		}, {
			"id": 704,
			"spell": "qujiang",
			"name": "曲江"
		}],
		"R": [{
			"id": 235,
			"spell": "rikaze",
			"name": "日喀则"
		}, {
			"id": 236,
			"spell": "rizhao",
			"name": "日照"
		}, {
			"id": 705,
			"spell": "raoping",
			"name": "饶平"
		}, {
			"id": 706,
			"spell": "renhua",
			"name": "仁化"
		}, {
			"id": 707,
			"spell": "rongan",
			"name": "融安"
		}, {
			"id": 708,
			"spell": "rongchang",
			"name": "荣昌"
		}, {
			"id": 709,
			"spell": "rongcheng",
			"name": "荣成"
		}, {
			"id": 710,
			"spell": "rongshui",
			"name": "融水"
		}, {
			"id": 711,
			"spell": "rudong",
			"name": "如东"
		}, {
			"id": 712,
			"spell": "rugao",
			"name": "如皋"
		}, {
			"id": 713,
			"spell": "ruian",
			"name": "瑞安"
		}, {
			"id": 714,
			"spell": "ruichang",
			"name": "瑞昌"
		}, {
			"id": 715,
			"spell": "ruijin",
			"name": "瑞金"
		}, {
			"id": 716,
			"spell": "rushan",
			"name": "乳山"
		}, {
			"id": 717,
			"spell": "ruyang",
			"name": "汝阳"
		}, {
			"id": 718,
			"spell": "ruyuan",
			"name": "乳源"
		}],
		"S": [{
			"id": 3,
			"spell": "shanghai",
			"name": "上海"
		}, {
			"id": 36,
			"spell": "shenyang",
			"name": "沈阳"
		}, {
			"id": 37,
			"spell": "shenzhen",
			"name": "深圳"
		}, {
			"id": 38,
			"spell": "shijiazhuang",
			"name": "石家庄"
		}, {
			"id": 39,
			"spell": "suzhou",
			"name": "苏州"
		}, {
			"id": 237,
			"spell": "sanmenxia",
			"name": "三门峡"
		}, {
			"id": 238,
			"spell": "sanming",
			"name": "三明"
		}, {
			"id": 239,
			"spell": "sanya",
			"name": "三亚"
		}, {
			"id": 240,
			"spell": "shangluo",
			"name": "商洛"
		}, {
			"id": 241,
			"spell": "shangqiu",
			"name": "商丘"
		}, {
			"id": 242,
			"spell": "shangrao",
			"name": "上饶"
		}, {
			"id": 243,
			"spell": "shannan",
			"name": "山南"
		}, {
			"id": 244,
			"spell": "shantou",
			"name": "汕头"
		}, {
			"id": 245,
			"spell": "shanwei",
			"name": "汕尾"
		}, {
			"id": 246,
			"spell": "shaoguan",
			"name": "韶关"
		}, {
			"id": 247,
			"spell": "shaoxing",
			"name": "绍兴"
		}, {
			"id": 248,
			"spell": "shaoyang",
			"name": "邵阳"
		}, {
			"id": 249,
			"spell": "shiyan",
			"name": "十堰"
		}, {
			"id": 250,
			"spell": "shizuishan",
			"name": "石嘴山"
		}, {
			"id": 251,
			"spell": "shuangyashan",
			"name": "双鸭山"
		}, {
			"id": 252,
			"spell": "shuozhou",
			"name": "朔州"
		}, {
			"id": 253,
			"spell": "siping",
			"name": "四平"
		}, {
			"id": 254,
			"spell": "songyuan",
			"name": "松原"
		}, {
			"id": 255,
			"spell": "suihua",
			"name": "绥化"
		}, {
			"id": 256,
			"spell": "suining",
			"name": "遂宁"
		}, {
			"id": 257,
			"spell": "suizhou",
			"name": "随州"
		}, {
			"id": 258,
			"spell": "suqian",
			"name": "宿迁"
		}, {
			"id": 259,
			"spell": "suzhou",
			"name": "宿州"
		}, {
			"id": 719,
			"spell": "sanjiang",
			"name": "三江"
		}, {
			"id": 720,
			"spell": "sanmen",
			"name": "三门"
		}, {
			"id": 721,
			"spell": "saoan",
			"name": "诏安"
		}, {
			"id": 722,
			"spell": "shanggao",
			"name": "上高"
		}, {
			"id": 723,
			"spell": "shanghang",
			"name": "上杭"
		}, {
			"id": 724,
			"spell": "shanghe",
			"name": "商河"
		}, {
			"id": 725,
			"spell": "shangli",
			"name": "上栗"
		}, {
			"id": 726,
			"spell": "shanglin",
			"name": "上林"
		}, {
			"id": 727,
			"spell": "shangrao",
			"name": "上饶"
		}, {
			"id": 728,
			"spell": "shangyou",
			"name": "上犹"
		}, {
			"id": 729,
			"spell": "shangyu",
			"name": "上虞"
		}, {
			"id": 730,
			"spell": "shangzhi",
			"name": "尚志"
		}, {
			"id": 731,
			"spell": "shaowu",
			"name": "邵武"
		}, {
			"id": 732,
			"spell": "shaoxing",
			"name": "绍兴"
		}, {
			"id": 733,
			"spell": "shaxian",
			"name": "沙县"
		}, {
			"id": 734,
			"spell": "shengsi",
			"name": "嵊泗"
		}, {
			"id": 735,
			"spell": "shengzhou",
			"name": "嵊州"
		}, {
			"id": 736,
			"spell": "shenxian",
			"name": "莘县"
		}, {
			"id": 737,
			"spell": "shenze",
			"name": "深泽"
		}, {
			"id": 738,
			"spell": "shexian",
			"name": "歙县"
		}, {
			"id": 739,
			"spell": "sheyang",
			"name": "射阳"
		}, {
			"id": 740,
			"spell": "shicheng",
			"name": "石城"
		}, {
			"id": 741,
			"spell": "shilin",
			"name": "石林"
		}, {
			"id": 742,
			"spell": "shishi",
			"name": "石狮"
		}, {
			"id": 743,
			"spell": "shitai",
			"name": "石台"
		}, {
			"id": 744,
			"spell": "shixing",
			"name": "始兴"
		}, {
			"id": 745,
			"spell": "shizhu",
			"name": "石柱"
		}, {
			"id": 746,
			"spell": "shouguang",
			"name": "寿光"
		}, {
			"id": 747,
			"spell": "shouning",
			"name": "寿宁"
		}, {
			"id": 748,
			"spell": "shouxian",
			"name": "寿县"
		}, {
			"id": 749,
			"spell": "shuangcheng",
			"name": "双城"
		}, {
			"id": 750,
			"spell": "shuangliu",
			"name": "双流"
		}, {
			"id": 751,
			"spell": "shucheng",
			"name": "舒城"
		}, {
			"id": 752,
			"spell": "shulan",
			"name": "舒兰"
		}, {
			"id": 753,
			"spell": "shunchang",
			"name": "顺昌"
		}, {
			"id": 754,
			"spell": "shuyang",
			"name": "沭阳"
		}, {
			"id": 755,
			"spell": "sihong",
			"name": "泗洪"
		}, {
			"id": 756,
			"spell": "sihui",
			"name": "四会"
		}, {
			"id": 757,
			"spell": "sishui",
			"name": "泗水"
		}, {
			"id": 758,
			"spell": "sixian",
			"name": "泗县"
		}, {
			"id": 759,
			"spell": "siyang",
			"name": "泗阳"
		}, {
			"id": 760,
			"spell": "songming",
			"name": "嵩明"
		}, {
			"id": 761,
			"spell": "songxi",
			"name": "松溪"
		}, {
			"id": 762,
			"spell": "songxian",
			"name": "嵩县"
		}, {
			"id": 763,
			"spell": "songyang",
			"name": "松阳"
		}, {
			"id": 764,
			"spell": "suichang",
			"name": "遂昌"
		}, {
			"id": 765,
			"spell": "suichuan",
			"name": "遂川"
		}, {
			"id": 766,
			"spell": "suining",
			"name": "睢宁"
		}, {
			"id": 767,
			"spell": "suixi",
			"name": "濉溪"
		}, {
			"id": 768,
			"spell": "suixi",
			"name": "遂溪"
		}, {
			"id": 769,
			"spell": "susong",
			"name": "宿松"
		}, {
			"id": 770,
			"spell": "suyu",
			"name": "宿豫"
		}],
		"T": [{
			"id": 4,
			"spell": "tianjin",
			"name": "天津"
		}, {
			"id": 40,
			"spell": "taizhou",
			"name": "台州"
		}, {
			"id": 41,
			"spell": "tangshan",
			"name": "唐山"
		}, {
			"id": 260,
			"spell": "tachengdi",
			"name": "塔城地"
		}, {
			"id": 261,
			"spell": "taian",
			"name": "泰安"
		}, {
			"id": 262,
			"spell": "taiyuan",
			"name": "太原"
		}, {
			"id": 263,
			"spell": "taizhou",
			"name": "泰州"
		}, {
			"id": 264,
			"spell": "tianshui",
			"name": "天水"
		}, {
			"id": 265,
			"spell": "tieling",
			"name": "铁岭"
		}, {
			"id": 266,
			"spell": "tongchuan",
			"name": "铜川"
		}, {
			"id": 267,
			"spell": "tonghua",
			"name": "通化"
		}, {
			"id": 268,
			"spell": "tongliao",
			"name": "通辽"
		}, {
			"id": 269,
			"spell": "tongling",
			"name": "铜陵"
		}, {
			"id": 270,
			"spell": "tongren",
			"name": "铜仁"
		}, {
			"id": 271,
			"spell": "tulufan",
			"name": "吐鲁番"
		}, {
			"id": 771,
			"spell": "taicang",
			"name": "太仓"
		}, {
			"id": 772,
			"spell": "taihe",
			"name": "太和"
		}, {
			"id": 773,
			"spell": "taihe",
			"name": "泰和"
		}, {
			"id": 774,
			"spell": "taihu",
			"name": "太湖"
		}, {
			"id": 775,
			"spell": "taining",
			"name": "泰宁"
		}, {
			"id": 776,
			"spell": "taishan",
			"name": "台山"
		}, {
			"id": 777,
			"spell": "taishun",
			"name": "泰顺"
		}, {
			"id": 778,
			"spell": "taixing",
			"name": "泰兴"
		}, {
			"id": 779,
			"spell": "tancheng",
			"name": "郯城"
		}, {
			"id": 780,
			"spell": "tanghai",
			"name": "唐海"
		}, {
			"id": 781,
			"spell": "tengzhou",
			"name": "滕州"
		}, {
			"id": 782,
			"spell": "tianchang",
			"name": "天长"
		}, {
			"id": 783,
			"spell": "tiantai",
			"name": "天台"
		}, {
			"id": 784,
			"spell": "tongcheng",
			"name": "桐城"
		}, {
			"id": 785,
			"spell": "tonggu",
			"name": "铜鼓"
		}, {
			"id": 786,
			"spell": "tonghe",
			"name": "通河"
		}, {
			"id": 787,
			"spell": "tongliang",
			"name": "铜梁"
		}, {
			"id": 788,
			"spell": "tongling",
			"name": "铜陵"
		}, {
			"id": 789,
			"spell": "tonglu",
			"name": "桐庐"
		}, {
			"id": 790,
			"spell": "tongnan",
			"name": "潼南"
		}, {
			"id": 791,
			"spell": "tongshan",
			"name": "铜山"
		}, {
			"id": 792,
			"spell": "tongxiang",
			"name": "桐乡"
		}, {
			"id": 793,
			"spell": "tongzhou",
			"name": "通州"
		}],
		"W": [{
			"id": 42,
			"spell": "weifang",
			"name": "潍坊"
		}, {
			"id": 43,
			"spell": "weihai",
			"name": "威海"
		}, {
			"id": 44,
			"spell": "wuhan",
			"name": "武汉"
		}, {
			"id": 45,
			"spell": "wuxi",
			"name": "无锡"
		}, {
			"id": 272,
			"spell": "weinan",
			"name": "渭南"
		}, {
			"id": 273,
			"spell": "wenshan",
			"name": "文山"
		}, {
			"id": 274,
			"spell": "wenzhou",
			"name": "温州"
		}, {
			"id": 275,
			"spell": "wuhai",
			"name": "乌海"
		}, {
			"id": 276,
			"spell": "wuhu",
			"name": "芜湖"
		}, {
			"id": 277,
			"spell": "wulanchabu",
			"name": "乌兰察布"
		}, {
			"id": 278,
			"spell": "wulumuqi",
			"name": "乌鲁木齐"
		}, {
			"id": 279,
			"spell": "wuwei",
			"name": "武威"
		}, {
			"id": 280,
			"spell": "wuzhong",
			"name": "吴忠"
		}, {
			"id": 281,
			"spell": "wuzhou",
			"name": "梧州"
		}, {
			"id": 794,
			"spell": "wafangdian",
			"name": "瓦房店"
		}, {
			"id": 795,
			"spell": "wanan",
			"name": "万安"
		}, {
			"id": 796,
			"spell": "wangcheng",
			"name": "望城"
		}, {
			"id": 797,
			"spell": "wangjiang",
			"name": "望江"
		}, {
			"id": 798,
			"spell": "wannian",
			"name": "万年"
		}, {
			"id": 799,
			"spell": "wanzai",
			"name": "万载"
		}, {
			"id": 800,
			"spell": "weishan",
			"name": "微山"
		}, {
			"id": 801,
			"spell": "wencheng",
			"name": "文成"
		}, {
			"id": 802,
			"spell": "wendeng",
			"name": "文登"
		}, {
			"id": 803,
			"spell": "wengyuan",
			"name": "翁源"
		}, {
			"id": 804,
			"spell": "wenling",
			"name": "温岭"
		}, {
			"id": 805,
			"spell": "wenshang",
			"name": "汶上"
		}, {
			"id": 806,
			"spell": "wenxian",
			"name": "温县"
		}, {
			"id": 807,
			"spell": "woyang",
			"name": "涡阳"
		}, {
			"id": 808,
			"spell": "wuchang",
			"name": "五常"
		}, {
			"id": 809,
			"spell": "wucheng",
			"name": "武城"
		}, {
			"id": 810,
			"spell": "wuchuan",
			"name": "吴川"
		}, {
			"id": 811,
			"spell": "wudi",
			"name": "无棣"
		}, {
			"id": 812,
			"spell": "wuhe",
			"name": "五河"
		}, {
			"id": 813,
			"spell": "wuhu",
			"name": "芜湖"
		}, {
			"id": 814,
			"spell": "wuhua",
			"name": "五华"
		}, {
			"id": 815,
			"spell": "wuji",
			"name": "无极"
		}, {
			"id": 816,
			"spell": "wujiang",
			"name": "吴江"
		}, {
			"id": 817,
			"spell": "wulian",
			"name": "五莲"
		}, {
			"id": 818,
			"spell": "wulong",
			"name": "武隆"
		}, {
			"id": 819,
			"spell": "wuming",
			"name": "武鸣"
		}, {
			"id": 820,
			"spell": "wuning",
			"name": "武宁"
		}, {
			"id": 821,
			"spell": "wuping",
			"name": "武平"
		}, {
			"id": 822,
			"spell": "wushan",
			"name": "巫山"
		}, {
			"id": 823,
			"spell": "wuwei",
			"name": "无为"
		}, {
			"id": 824,
			"spell": "wuxi",
			"name": "巫溪"
		}, {
			"id": 825,
			"spell": "wuyi",
			"name": "武义"
		}, {
			"id": 826,
			"spell": "wuyishan",
			"name": "武夷山"
		}, {
			"id": 827,
			"spell": "wuyuan",
			"name": "婺源"
		}, {
			"id": 828,
			"spell": "wuzhi",
			"name": "武陟"
		}],
		"X": [{
			"id": 46,
			"spell": "xiamen",
			"name": "厦门"
		}, {
			"id": 47,
			"spell": "xian",
			"name": "西安"
		}, {
			"id": 48,
			"spell": "xuchang",
			"name": "许昌"
		}, {
			"id": 49,
			"spell": "xuzhou",
			"name": "徐州"
		}, {
			"id": 282,
			"spell": "xiangfan",
			"name": "襄樊"
		}, {
			"id": 283,
			"spell": "xiangtan",
			"name": "湘潭"
		}, {
			"id": 284,
			"spell": "xiangxi",
			"name": "湘西"
		}, {
			"id": 285,
			"spell": "xianning",
			"name": "咸宁"
		}, {
			"id": 286,
			"spell": "xianyang",
			"name": "咸阳"
		}, {
			"id": 287,
			"spell": "xiaogan",
			"name": "孝感"
		}, {
			"id": 288,
			"spell": "xilinguolemeng",
			"name": "锡林郭勒盟"
		}, {
			"id": 289,
			"spell": "xinganmeng",
			"name": "兴安盟"
		}, {
			"id": 290,
			"spell": "xingtai",
			"name": "邢台"
		}, {
			"id": 291,
			"spell": "xining",
			"name": "西宁"
		}, {
			"id": 292,
			"spell": "xinxiang",
			"name": "新乡"
		}, {
			"id": 293,
			"spell": "xinyang",
			"name": "信阳"
		}, {
			"id": 294,
			"spell": "xinyu",
			"name": "新余"
		}, {
			"id": 295,
			"spell": "xinzhou",
			"name": "忻州"
		}, {
			"id": 296,
			"spell": "xishuangbanna",
			"name": "西双版纳"
		}, {
			"id": 297,
			"spell": "xuancheng",
			"name": "宣城"
		}, {
			"id": 829,
			"spell": "xiajiang",
			"name": "峡江"
		}, {
			"id": 830,
			"spell": "xiajin",
			"name": "夏津"
		}, {
			"id": 831,
			"spell": "xiangshan",
			"name": "象山"
		}, {
			"id": 832,
			"spell": "xiangshui",
			"name": "响水"
		}, {
			"id": 833,
			"spell": "xianju",
			"name": "仙居"
		}, {
			"id": 834,
			"spell": "xianyou",
			"name": "仙游"
		}, {
			"id": 835,
			"spell": "xiaoxian",
			"name": "萧县"
		}, {
			"id": 836,
			"spell": "xiapu",
			"name": "霞浦"
		}, {
			"id": 837,
			"spell": "xifeng",
			"name": "息烽"
		}, {
			"id": 838,
			"spell": "xinan",
			"name": "新安"
		}, {
			"id": 839,
			"spell": "xinchang",
			"name": "新昌"
		}, {
			"id": 840,
			"spell": "xinfeng",
			"name": "信丰"
		}, {
			"id": 841,
			"spell": "xinfeng",
			"name": "新丰"
		}, {
			"id": 842,
			"spell": "xingan",
			"name": "新干"
		}, {
			"id": 843,
			"spell": "xingguo",
			"name": "兴国"
		}, {
			"id": 844,
			"spell": "xinghua",
			"name": "兴化"
		}, {
			"id": 845,
			"spell": "xingning",
			"name": "兴宁"
		}, {
			"id": 846,
			"spell": "xingtang",
			"name": "行唐"
		}, {
			"id": 847,
			"spell": "xingyang",
			"name": "荥阳"
		}, {
			"id": 848,
			"spell": "xingzi",
			"name": "星子"
		}, {
			"id": 849,
			"spell": "xinji",
			"name": "辛集"
		}, {
			"id": 850,
			"spell": "xinjian",
			"name": "新建"
		}, {
			"id": 851,
			"spell": "xinjin",
			"name": "新津"
		}, {
			"id": 852,
			"spell": "xinle",
			"name": "新乐"
		}, {
			"id": 853,
			"spell": "xinmin",
			"name": "新民"
		}, {
			"id": 854,
			"spell": "xinmi",
			"name": "新密"
		}, {
			"id": 855,
			"spell": "xintai",
			"name": "新泰"
		}, {
			"id": 856,
			"spell": "xinxing",
			"name": "新兴"
		}, {
			"id": 857,
			"spell": "xinyi",
			"name": "新沂"
		}, {
			"id": 858,
			"spell": "xinyi",
			"name": "信宜"
		}, {
			"id": 859,
			"spell": "xinzheng",
			"name": "新郑"
		}, {
			"id": 860,
			"spell": "xiuning",
			"name": "休宁"
		}, {
			"id": 861,
			"spell": "xiushan",
			"name": "秀山"
		}, {
			"id": 862,
			"spell": "xiushui",
			"name": "修水"
		}, {
			"id": 863,
			"spell": "xiuwen",
			"name": "修文"
		}, {
			"id": 864,
			"spell": "xiuwu",
			"name": "修武"
		}, {
			"id": 865,
			"spell": "xundian",
			"name": "寻甸"
		}, {
			"id": 866,
			"spell": "xunwu",
			"name": "寻乌"
		}, {
			"id": 867,
			"spell": "xuwen",
			"name": "徐闻"
		}, {
			"id": 868,
			"spell": "xuyi",
			"name": "盱眙"
		}],
		"Y": [{
			"id": 50,
			"spell": "yangzhou",
			"name": "扬州"
		}, {
			"id": 51,
			"spell": "yantai",
			"name": "烟台"
		}, {
			"id": 298,
			"spell": "yaan",
			"name": "雅安"
		}, {
			"id": 299,
			"spell": "yanan",
			"name": "延安"
		}, {
			"id": 300,
			"spell": "yanbian",
			"name": "延边"
		}, {
			"id": 301,
			"spell": "yancheng",
			"name": "盐城"
		}, {
			"id": 302,
			"spell": "yangjiang",
			"name": "阳江"
		}, {
			"id": 303,
			"spell": "yangquan",
			"name": "阳泉"
		}, {
			"id": 304,
			"spell": "yibin",
			"name": "宜宾"
		}, {
			"id": 305,
			"spell": "yichang",
			"name": "宜昌"
		}, {
			"id": 306,
			"spell": "yichun",
			"name": "伊春"
		}, {
			"id": 307,
			"spell": "yichun",
			"name": "宜春"
		}, {
			"id": 308,
			"spell": "yilihasake",
			"name": "伊犁哈萨克"
		}, {
			"id": 309,
			"spell": "yinchuan",
			"name": "银川"
		}, {
			"id": 310,
			"spell": "yingkou",
			"name": "营口"
		}, {
			"id": 311,
			"spell": "yingtan",
			"name": "鹰潭"
		}, {
			"id": 312,
			"spell": "yiyang",
			"name": "益阳"
		}, {
			"id": 313,
			"spell": "yongzhou",
			"name": "永州"
		}, {
			"id": 314,
			"spell": "yueyang",
			"name": "岳阳"
		}, {
			"id": 315,
			"spell": "yulin",
			"name": "玉林"
		}, {
			"id": 316,
			"spell": "yulin",
			"name": "榆林"
		}, {
			"id": 317,
			"spell": "yuncheng",
			"name": "运城"
		}, {
			"id": 318,
			"spell": "yunfu",
			"name": "云浮"
		}, {
			"id": 319,
			"spell": "yushu",
			"name": "玉树"
		}, {
			"id": 320,
			"spell": "yuxi",
			"name": "玉溪"
		}, {
			"id": 869,
			"spell": "yangchun",
			"name": "阳春"
		}, {
			"id": 870,
			"spell": "yangdong",
			"name": "阳东"
		}, {
			"id": 871,
			"spell": "yanggu",
			"name": "阳谷"
		}, {
			"id": 872,
			"spell": "yangshan",
			"name": "阳山"
		}, {
			"id": 873,
			"spell": "yangxin",
			"name": "阳信"
		}, {
			"id": 874,
			"spell": "yangxi",
			"name": "阳西"
		}, {
			"id": 875,
			"spell": "yangzhong",
			"name": "扬中"
		}, {
			"id": 876,
			"spell": "yanshi",
			"name": "偃师"
		}, {
			"id": 877,
			"spell": "yanshou",
			"name": "延寿"
		}, {
			"id": 878,
			"spell": "yanzhou",
			"name": "兖州"
		}, {
			"id": 879,
			"spell": "yichuan",
			"name": "伊川"
		}, {
			"id": 880,
			"spell": "yifeng",
			"name": "宜丰"
		}, {
			"id": 881,
			"spell": "yihuang",
			"name": "宜黄"
		}, {
			"id": 882,
			"spell": "yilan",
			"name": "依兰"
		}, {
			"id": 883,
			"spell": "yiliang",
			"name": "宜良"
		}, {
			"id": 884,
			"spell": "yinan",
			"name": "沂南"
		}, {
			"id": 885,
			"spell": "yingde",
			"name": "英德"
		}, {
			"id": 886,
			"spell": "yingshang",
			"name": "颍上"
		}, {
			"id": 887,
			"spell": "yishui",
			"name": "沂水"
		}, {
			"id": 888,
			"spell": "yiwu",
			"name": "义乌"
		}, {
			"id": 889,
			"spell": "yixian",
			"name": "黟县"
		}, {
			"id": 890,
			"spell": "yixing",
			"name": "宜兴"
		}, {
			"id": 891,
			"spell": "yiyang",
			"name": "弋阳"
		}, {
			"id": 892,
			"spell": "yiyang",
			"name": "宜阳"
		}, {
			"id": 893,
			"spell": "yiyuan",
			"name": "沂源"
		}, {
			"id": 894,
			"spell": "yizheng",
			"name": "仪征"
		}, {
			"id": 895,
			"spell": "yongan",
			"name": "永安"
		}, {
			"id": 896,
			"spell": "yongchuan",
			"name": "永川"
		}, {
			"id": 897,
			"spell": "yongchun",
			"name": "永春"
		}, {
			"id": 898,
			"spell": "yongdeng",
			"name": "永登"
		}, {
			"id": 899,
			"spell": "yongding",
			"name": "永定"
		}, {
			"id": 900,
			"spell": "yongfeng",
			"name": "永丰"
		}, {
			"id": 901,
			"spell": "yongji",
			"name": "永吉"
		}, {
			"id": 902,
			"spell": "yongjia",
			"name": "永嘉"
		}, {
			"id": 903,
			"spell": "yongkang",
			"name": "永康"
		}, {
			"id": 904,
			"spell": "yongning",
			"name": "邕宁"
		}, {
			"id": 905,
			"spell": "yongtai",
			"name": "永泰"
		}, {
			"id": 906,
			"spell": "yongxin",
			"name": "永新"
		}, {
			"id": 907,
			"spell": "yongxiu",
			"name": "永修"
		}, {
			"id": 908,
			"spell": "youxi",
			"name": "尤溪"
		}, {
			"id": 909,
			"spell": "youyang",
			"name": "酉阳"
		}, {
			"id": 910,
			"spell": "yuanshi",
			"name": "元氏"
		}, {
			"id": 911,
			"spell": "yucheng",
			"name": "禹城"
		}, {
			"id": 912,
			"spell": "yudu",
			"name": "于都"
		}, {
			"id": 913,
			"spell": "yuexi",
			"name": "岳西"
		}, {
			"id": 914,
			"spell": "yugan",
			"name": "余干"
		}, {
			"id": 915,
			"spell": "yuhuan",
			"name": "玉环"
		}, {
			"id": 916,
			"spell": "yujiang",
			"name": "余江"
		}, {
			"id": 917,
			"spell": "yunan",
			"name": "郁南"
		}, {
			"id": 918,
			"spell": "yunan",
			"name": "云安"
		}, {
			"id": 919,
			"spell": "yuncheng",
			"name": "郓城"
		}, {
			"id": 920,
			"spell": "yunhe",
			"name": "云和"
		}, {
			"id": 921,
			"spell": "yunxiao",
			"name": "云霄"
		}, {
			"id": 922,
			"spell": "yunyang",
			"name": "云阳"
		}, {
			"id": 923,
			"spell": "yushan",
			"name": "玉山"
		}, {
			"id": 924,
			"spell": "yushu",
			"name": "榆树"
		}, {
			"id": 925,
			"spell": "yutai",
			"name": "鱼台"
		}, {
			"id": 926,
			"spell": "yutian",
			"name": "玉田"
		}, {
			"id": 927,
			"spell": "yuyao",
			"name": "余姚"
		}, {
			"id": 928,
			"spell": "yuzhong",
			"name": "榆中"
		}],
		"Z": [{
			"id": 52,
			"spell": "zhangzhou",
			"name": "漳州"
		}, {
			"id": 53,
			"spell": "zhengzhou",
			"name": "郑州"
		}, {
			"id": 54,
			"spell": "zhongshan",
			"name": "中山"
		}, {
			"id": 55,
			"spell": "zhuhai",
			"name": "珠海"
		}, {
			"id": 321,
			"spell": "zaozhuang",
			"name": "枣庄"
		}, {
			"id": 322,
			"spell": "zhangjiajie",
			"name": "张家界"
		}, {
			"id": 323,
			"spell": "zhangjiakou",
			"name": "张家口"
		}, {
			"id": 324,
			"spell": "zhangye",
			"name": "张掖"
		}, {
			"id": 325,
			"spell": "zhanjiang",
			"name": "湛江"
		}, {
			"id": 326,
			"spell": "zhaoqing",
			"name": "肇庆"
		}, {
			"id": 327,
			"spell": "zhaotong",
			"name": "昭通"
		}, {
			"id": 328,
			"spell": "zhenjiang",
			"name": "镇江"
		}, {
			"id": 329,
			"spell": "zhongwei",
			"name": "中卫"
		}, {
			"id": 330,
			"spell": "zhoukou",
			"name": "周口"
		}, {
			"id": 331,
			"spell": "zhoushan",
			"name": "舟山"
		}, {
			"id": 332,
			"spell": "zhumadian",
			"name": "驻马店"
		}, {
			"id": 333,
			"spell": "zhuzhou",
			"name": "株洲"
		}, {
			"id": 334,
			"spell": "zibo",
			"name": "淄博"
		}, {
			"id": 335,
			"spell": "zigong",
			"name": "自贡"
		}, {
			"id": 336,
			"spell": "ziyang",
			"name": "资阳"
		}, {
			"id": 337,
			"spell": "zunyi",
			"name": "遵义"
		}, {
			"id": 929,
			"spell": "zanhuang",
			"name": "赞皇"
		}, {
			"id": 930,
			"spell": "zengcheng",
			"name": "增城"
		}, {
			"id": 931,
			"spell": "zhangjiagang",
			"name": "张家港"
		}, {
			"id": 932,
			"spell": "zhangping",
			"name": "漳平"
		}, {
			"id": 933,
			"spell": "zhangpu",
			"name": "漳浦"
		}, {
			"id": 934,
			"spell": "zhangqiu",
			"name": "章丘"
		}, {
			"id": 935,
			"spell": "zhangshu",
			"name": "樟树"
		}, {
			"id": 936,
			"spell": "zhanhua",
			"name": "沾化"
		}, {
			"id": 937,
			"spell": "zhaoxian",
			"name": "赵县"
		}, {
			"id": 938,
			"spell": "zhaoyuan",
			"name": "招远"
		}, {
			"id": 939,
			"spell": "zhengding",
			"name": "正定"
		}, {
			"id": 940,
			"spell": "zhenghe",
			"name": "政和"
		}, {
			"id": 941,
			"spell": "zherong",
			"name": "柘荣"
		}, {
			"id": 942,
			"spell": "zhongmou",
			"name": "中牟"
		}, {
			"id": 943,
			"spell": "zhongxian",
			"name": "忠县"
		}, {
			"id": 944,
			"spell": "zhouning",
			"name": "周宁"
		}, {
			"id": 945,
			"spell": "zhouzhi",
			"name": "周至"
		}, {
			"id": 946,
			"spell": "zhuanghe",
			"name": "庄河"
		}, {
			"id": 947,
			"spell": "zhucheng",
			"name": "诸城"
		}, {
			"id": 948,
			"spell": "zhuji",
			"name": "诸暨"
		}, {
			"id": 949,
			"spell": "zijin",
			"name": "紫金"
		}, {
			"id": 950,
			"spell": "zixi",
			"name": "资溪"
		}, {
			"id": 951,
			"spell": "zoucheng",
			"name": "邹城"
		}, {
			"id": 952,
			"spell": "zouping",
			"name": "邹平"
		}, {
			"id": 953,
			"spell": "zunhua",
			"name": "遵化"
		}]
	}
}

province.json

省份

json
{
  "A": [{
    "name": "安徽",
    "id": "A",
    "data": [
      "合肥",
      "芜湖",
      "蚌埠",
      "淮南",
      "马鞍山",
      "淮北",
      "铜陵",
      "安庆",
      "黄山",
      "滁州",
      "阜阳",
      "宿州",
      "六安",
      "亳州",
      "池州",
      "宣城"
    ]
  }],
  "C": [{
    "name": "重庆",
    "id": "C",
    "data": [
      "万州",
      "涪陵",
      "渝中",
      "大渡口",
      "江北",
      "沙坪坝",
      "九龙坡",
      "南岸",
      "北碚",
      "綦江",
      "大足",
      "渝北",
      "巴南",
      "黔江",
      "长寿",
      "江津",
      "合川",
      "永川",
      "南川",
      "璧山",
      "铜梁",
      "潼南",
      "荣昌",
      "开州",
      "梁平",
      "武隆",
      "城口县",
      "丰都县",
      "垫江县",
      "忠县",
      "云阳县",
      "奉节县",
      "巫山县",
      "巫溪县",
      "石柱土家族自治县",
      "秀山土家族苗族自治县",
      "酉阳土家族苗族自治县",
      "彭水苗族土家族自治县"
    ]
  }],
  "F": [{
    "name": "福建",
    "id": "F",
    "data": [
      "福州",
      "厦门",
      "莆田",
      "三明",
      "泉州",
      "漳州",
      "南平",
      "龙岩",
      "宁德"
    ]
  }],
  "G": [{
      "name": "广东",
      "id": "G",
      "data": [
        "广州",
        "韶关",
        "深圳",
        "珠海",
        "汕头",
        "佛山",
        "江门",
        "湛江",
        "茂名",
        "肇庆",
        "惠州",
        "梅州",
        "汕尾",
        "河源",
        "阳江",
        "清远",
        "东莞",
        "中山",
        "潮州",
        "揭阳",
        "云浮"
      ]
    },
    {
      "name": "广西",
      "data": [
        "南宁",
        "柳州",
        "桂林",
        "梧州",
        "北海",
        "防城港",
        "钦州",
        "贵港",
        "玉林",
        "百色",
        "贺州",
        "河池",
        "来宾",
        "崇左"
      ]
    },
    {
      "name": "贵州",
      "data": [
        "贵阳",
        "六盘水",
        "遵义",
        "安顺",
        "毕节",
        "铜仁",
        "黔西南布依族苗族自治州",
        "黔东南苗族侗族自治州",
        "黔南布依族苗族自治州"
      ]
    },
    {
      "name": "甘肃",
      "data": [
        "兰州",
        "嘉峪关",
        "金昌",
        "白银",
        "天水",
        "武威",
        "张掖",
        "平凉",
        "酒泉",
        "庆阳",
        "定西",
        "陇南",
        "临夏回族自治州",
        "甘南藏族自治州"
      ]
    }
  ],
  "H": [{
      "name": "河北",
      "id": "H",
      "data": [
        "石家庄",
        "唐山",
        "秦皇岛",
        "邯郸",
        "邢台",
        "保定",
        "张家口",
        "承德",
        "沧州",
        "廊坊",
        "衡水"
      ]
    },
    {
      "name": "黑龙江",
      "data": [
        "哈尔滨",
        "齐齐哈尔",
        "鸡西",
        "鹤岗",
        "双鸭山",
        "大庆",
        "伊春",
        "佳木斯",
        "七台河",
        "牡丹江",
        "黑河",
        "绥化",
        "大兴安岭地"
      ]
    },
    {
      "name": "河南",
      "data": [
        "郑州",
        "开封",
        "洛阳",
        "平顶山",
        "安阳",
        "鹤壁",
        "新乡",
        "焦作",
        "濮阳",
        "许昌",
        "漯河",
        "三门峡",
        "南阳",
        "商丘",
        "信阳",
        "周口",
        "驻马店",
        "济源"
      ]
    },
    {
      "name": "湖北",
      "data": [
        "武汉",
        "黄石",
        "十堰",
        "宜昌",
        "襄阳",
        "鄂州",
        "荆门",
        "孝感",
        "荆州",
        "黄冈",
        "咸宁",
        "随州",
        "恩施土家族苗族自治州",
        "仙桃",
        "潜江",
        "天门",
        "神农架林"
      ]
    },
    {
      "name": "湖南",
      "data": [
        "长沙",
        "株洲",
        "湘潭",
        "衡阳",
        "邵阳",
        "岳阳",
        "常德",
        "张家界",
        "益阳",
        "郴州",
        "永州",
        "怀化",
        "娄底",
        "湘西土家族苗族自治州"
      ]
    },
    {
      "name": "海南",
      "data": [
        "海口",
        "三亚",
        "三沙",
        "儋州",
        "五指山",
        "琼海",
        "文昌",
        "万宁",
        "东方",
        "定安县",
        "屯昌县",
        "澄迈县",
        "临高县",
        "白沙黎族自治县",
        "昌江黎族自治县",
        "乐东黎族自治县",
        "陵水黎族自治县",
        "保亭黎族苗族自治县",
        "琼中黎族苗族自治县"
      ]
    }
  ],
  "J": [{
      "name": "吉林",
      "id": "J",
      "data": [
        "长春",
        "吉林",
        "四平",
        "辽源",
        "通化",
        "白山",
        "松原",
        "白城",
        "延边朝鲜族自治州"
      ]
    },
    {
      "name": "江苏",
      "data": [
        "南京",
        "无锡",
        "徐州",
        "常州",
        "苏州",
        "南通",
        "连云港",
        "淮安",
        "盐城",
        "扬州",
        "镇江",
        "泰州",
        "宿迁"
      ]
    },
    {
      "name": "江西",
      "data": [
        "南昌",
        "景德镇",
        "萍乡",
        "九江",
        "新余",
        "鹰潭",
        "赣州",
        "吉安",
        "宜春",
        "抚州",
        "上饶"
      ]
    }
  ],
  "L": [{
    "name": "辽宁",
    "id": "L",
    "data": [
      "沈阳",
      "大连",
      "鞍山",
      "抚顺",
      "本溪",
      "丹东",
      "锦州",
      "营口",
      "阜新",
      "辽阳",
      "盘锦",
      "铁岭",
      "朝阳",
      "葫芦岛"
    ]
  }],
  "N": [{
    "name": "内蒙古",
    "id": "N",
    "data": [
      "呼和浩特",
      "包头",
      "乌海",
      "赤峰",
      "通辽",
      "鄂尔多斯",
      "呼伦贝尔",
      "巴彦淖尔",
      "乌兰察布",
      "兴安盟",
      "锡林郭勒盟",
      "阿拉善盟"
    ]
  }, {
    "name": "宁夏",
    "data": [
      "银川",
      "石嘴山",
      "吴忠",
      "固原",
      "中卫"
    ]
  }],
  "Q": [{
    "name": "青海",
    "id": "Q",
    "data": [
      "西宁",
      "海东",
      "海北藏族自治州",
      "黄南藏族自治州",
      "海南藏族自治州",
      "果洛藏族自治州",
      "玉树藏族自治州",
      "海西蒙古族藏族自治州"
    ]
  }],
  "S": [{
      "name": "山西",
      "id": "S",
      "data": [
        "太原",
        "大同",
        "阳泉",
        "长治",
        "晋城",
        "朔州",
        "晋中",
        "运城",
        "忻州",
        "临汾",
        "吕梁"
      ]
    },
    {
      "name": "上海",
      "data": [
        "黄浦",
        "徐汇",
        "长宁",
        "静安",
        "普陀",
        "虹口",
        "杨浦",
        "闵行",
        "宝山",
        "嘉定",
        "浦东新",
        "金山",
        "松江",
        "青浦",
        "奉贤",
        "崇明"
      ]
    },
    {
      "name": "山东",
      "data": [
        "济南",
        "青岛",
        "淄博",
        "枣庄",
        "东营",
        "烟台",
        "潍坊",
        "济宁",
        "泰安",
        "威海",
        "日照",
        "临沂",
        "德州",
        "聊城",
        "滨州",
        "菏泽"
      ]
    },
    {
      "name": "四川",
      "data": [
        "成都",
        "自贡",
        "攀枝花",
        "泸州",
        "德阳",
        "绵阳",
        "广元",
        "遂宁",
        "内江",
        "乐山",
        "南充",
        "眉山",
        "宜宾",
        "广安",
        "达州",
        "雅安",
        "巴中",
        "资阳",
        "阿坝藏族羌族自治州",
        "甘孜藏族自治州",
        "凉山彝族自治州"
      ]
    },
    {
      "name": "陕西",
      "data": [
        "西安",
        "铜川",
        "宝鸡",
        "咸阳",
        "渭南",
        "延安",
        "汉中",
        "榆林",
        "安康",
        "商洛"
      ]
    }
  ],
  "T": [{
    "name": "天津",
    "id": "T",
    "data": [
      "和平",
      "河东",
      "河西",
      "南开",
      "河北",
      "红桥",
      "东丽",
      "西青",
      "津南",
      "北辰",
      "武清",
      "宝坻",
      "滨海新",
      "宁河",
      "静海",
      "蓟州"
    ]
  }],
  "X": [{
      "name": "西藏",
      "id": "X",
      "data": [
        "拉萨",
        "日喀则",
        "昌都",
        "林芝",
        "山南",
        "那曲",
        "阿里地"
      ]
    },
    {
      "name": "新疆",
      "data": [
        "乌鲁木齐",
        "克拉玛依",
        "吐鲁番",
        "哈密",
        "昌吉回族自治州",
        "博尔塔拉蒙古自治州",
        "巴音郭楞蒙古自治州",
        "阿克苏地",
        "克孜勒苏柯尔克孜自治州",
        "喀什地",
        "和田地",
        "伊犁哈萨克自治州",
        "塔城地",
        "阿勒泰地",
        "石河子",
        "阿拉尔",
        "图木舒克",
        "五家渠",
        "北屯",
        "铁门关",
        "双河",
        "可克达拉",
        "昆玉",
        "胡杨河"
      ]
    }
  ],
  "Y": [{
    "name": "云南",
    "id": "Y",
    "data": [
      "昆明",
      "曲靖",
      "玉溪",
      "保山",
      "昭通",
      "丽江",
      "普洱",
      "临沧",
      "楚雄彝族自治州",
      "红河哈尼族彝族自治州",
      "文山壮族苗族自治州",
      "西双版纳傣族自治州",
      "大理白族自治州",
      "德宏傣族景颇族自治州",
      "怒江傈僳族自治州",
      "迪庆藏族自治州"
    ]
  }],
  "Z": [{
    "name": "浙江",
    "id": "Z",
    "data": [
      "杭州",
      "宁波",
      "温州",
      "嘉兴",
      "湖州",
      "绍兴",
      "金华",
      "衢州",
      "舟山",
      "台州",
      "丽水"
    ]
  }],
  "直辖市": [{
    "name": "直辖市",
    "id": "直辖市",
    "data": [
      "北京",
      "天津",
      "上海",
      "重庆"
    ]
  }],
  "港澳": [{
    "name": "港澳",
    "id": "港澳",
    "data": [
      "香港",
      "澳门"
    ]
  }]
}