二级数组省市表(二维数组json)
<一省份、城市二级联动+vue搭架>
a. template部分
<section class="edit__place">
<select v-model="selected">
<option v-for="province,index in Province" :value="province.text">
{{province.text}}
</option>
</select>
<select v-model="selectedCity">
<option v-for="City,index in selection" :value="City.text" :selected="index == 0 ? true : false">
{{City.text}}
</option>
</select>
</section>
b 数据交互data部分
selected: '省/直辖市',
selectedCity:"不限",
Province:[
{
text: "省/直辖市",
City: [{text: "不限"}]
},
{
text: "天津",
City: [
{text: "不限"},
{text: "天津"},
]
},
{
text: "河北",
City: [
{text: "不限"},
{text: "石家庄市"},
{text: "唐山市"},
{text: "秦皇岛市"},
{text: "邯郸市"},
{text: "邢台市"},
{text: "保定市"},
{text: "张家口市"},
{text: "承德市"},
{text: "沧州市"},
{text: "廊坊市"},
{text: "衡水市"}
]
},
{
text: "山西",
City: [
{text: "不限"},
{text: "太原市"},
{text: "大同市"},
{text: "阳泉市"},
{text: "长治市"},
{text: "晋城市"},
{text: "朔州市"},
{text: "晋中市"},
{text: "运城市"},
{text: "忻州市"},
{text: "临汾市"},
{text: "吕梁市"}
]
},
{
text: "内蒙古",
City: [
{text: "不限"},
{text: "呼和浩特市"},
{text: "包头市"},
{text: "乌海市"},
{text: "赤峰市"},
{text: "通辽市"},
{text: "鄂尔多斯市"},
{text: "呼伦贝尔市"},
{text: "巴彦淖尔市"},
{text: "乌兰察布市"},
{text: "兴安盟"},
{text: "锡林郭勒盟"},
{text: "阿拉善盟"}
]
},
{
text: "辽宁",
City: [
{text: "沈阳市"},
{text: "大连市"},
{text: "鞍山市"},
{text: "抚顺市"},
{text: "本溪市"},
{text: "丹东市"},
{text: "锦州市"},
{text: "营口市"},
{text: "阜新市"},
{text: "辽阳市"},
{text: "盘锦市"},
{text: "铁岭市"},
{text: "朝阳市"},
{text: "葫芦岛市"}
]
},
{
text: "吉林"
, City: [
{text: "长春市"},
{text: "吉林市"},
{text: "四平市"},
{text: "辽源市"},
{text: "通化市"},
{text: "白山市"},
{text: "松原市"},
{text: "白城市"},
{text: "延边朝鲜族自治州"}
]
},
{
text: "黑龙江"
, City: [
{text: "哈尔滨市"},
{text: "齐齐哈尔市"},
{text: "鸡西市"},
{text: "鹤岗市"},
{text: "双鸭山市"},
{text: "大庆市"},
{text: "伊春市"},
{text: "佳木斯市"},
{text: "七台河市"},
{text: "牡丹江市"},
{text: "黑河市"},
{text: "绥化市"},
{text: "大兴安岭地区"}
]
},
{
text: "上海"
, City: [
{text: "上海市"}
]
}, {
text: "江苏"
, City: [
{text: "南京市"},
{text: "无锡市"},
{text: "徐州市"},
{text: "常州市"},
{text: "苏州市"},
{text: "南通市"},
{text: "连云港市"},
{text: "淮安市"},
{text: "盐城市"},
{text: "扬州市"},
{text: "镇江市"},
{text: "泰州市"},
{text: "宿迁市"}
]
},
{
text: "浙江"
, City: [
{text: "杭州市"},
{text: "宁波市"},
{text: "温州市"},
{text: "嘉兴市"},
{text: "湖州市"},
{text: "绍兴市"},
{text: "金华市"},
{text: "衢州市"},
{text: "舟山市"},
{text: "台州市"},
{text: "丽水市"}
]
},
{
text: "安徽"
, City: [
{text: "合肥市"},
{text: "芜湖市"},
{text: "蚌埠市"},
{text: "淮南市"},
{text: "马鞍山市"},
{text: "淮北市"},
{text: "铜陵市"},
{text: "安庆市"},
{text: "黄山市"},
{text: "滁州市"},
{text: "阜阳市"},
{text: "宿州市"},
{text: "巢湖市"},
{text: "六安市"},
{text: "亳州市"},
{text: "池州市"},
{text: "宣城市"}
]
},
{
text: "福建"
, City: [
{text: "福州市"},
{text: "厦门市"},
{text: "莆田市"},
{text: "三明市"},
{text: "泉州市"},
{text: "漳州市"},
{text: "南平市"},
{text: "龙岩市"},
{text: "宁德市"}
]
},
{
text: "江西"
, City: [
{text: "南昌市"},
{text: "景德镇市"},
{text: "萍乡市"},
{text: "九江市"},
{text: "新余市"},
{text: "鹰潭市"},
{text: "赣州市"},
{text: "吉安市"},
{text: "宜春市"},
{text: "抚州市"},
{text: "上饶市"}
]
},
{
text: "山东"
, City: [
{text: "济南市"},
{text: "青岛市"},
{text: "淄博市"},
{text: "枣庄市"},
{text: "东营市"},
{text: "烟台市"},
{text: "潍坊市"},
{text: "济宁市"},
{text: "泰安市"},
{text: "威海市"},
{text: "日照市"},
{text: "莱芜市"},
{text: "临沂市"},
{text: "德州市"},
{text: "聊城市"},
{text: "滨州市"},
{text: "菏泽市"}
]
},
{
text: "河南"
, City: [
{text: "郑州市"},
{text: "开封市"},
{text: "洛阳市"},
{text: "平顶山市"},
{text: "安阳市"},
{text: "鹤壁市"},
{text: "新乡市"},
{text: "焦作市"},
{text: "濮阳市"},
{text: "许昌市"},
{text: "漯河市"},
{text: "三门峡市"},
{text: "南阳市"},
{text: "商丘市"},
{text: "信阳市"},
{text: "周口市"},
{text: "驻马店市"}
]
},
{
text: "湖北"
, City: [
{text: "武汉市"},
{text: "黄石市"},
{text: "十堰市"},
{text: "宜昌市"},
{text: "襄樊市"},
{text: "鄂州市"},
{text: "荆门市"},
{text: "孝感市"},
{text: "荆州市"},
{text: "黄冈市"},
{text: "咸宁市"},
{text: "随州市"},
{text: "恩施土家族苗族自治州"}
]
},
{
text: "湖南"
, City: [
{text: "长沙市"},
{text: "株洲市"},
{text: "湘潭市"},
{text: "衡阳市"},
{text: "邵阳市"},
{text: "岳阳市"},
{text: "常德市"},
{text: "张家界市"},
{text: "益阳市"},
{text: "郴州市"},
{text: "永州市"},
{text: "怀化市"},
{text: "娄底市"},
{text: "湘西土家族苗族自治州"}
]
},
{
text: "广东"
, City: [
{text: "广州市"},
{text: "韶关市"},
{text: "深圳市"},
{text: "珠海市"},
{text: "汕头市"},
{text: "佛山市"},
{text: "江门市"},
{text: "湛江市"},
{text: "茂名市"},
{text: "肇庆市"},
{text: "惠州市"},
{text: "梅州市"},
{text: "汕尾市"},
{text: "河源市"},
{text: "阳江市"},
{text: "清远市"},
{text: "东莞市"},
{text: "中山市"},
{text: "潮州市"},
{text: "揭阳市"},
{text: "云浮市"}
]
},
{
text: "广西"
, City: [
{text: "南宁市"},
{text: "柳州市"},
{text: "桂林市"},
{text: "梧州市"},
{text: "北海市"},
{text: "防城港市"},
{text: "钦州市"},
{text: "贵港市"},
{text: "玉林市"},
{text: "百色市"},
{text: "贺州市"},
{text: "河池市"},
{text: "来宾市"},
{text: "崇左市"}
]
},
{
text: "海南"
, City: [
{text: "海口市"},
{text: "三亚市"}
]
},
{
text: "重庆"
, City: [
{text: "重庆市"}
]
},
{
text: "四川"
, City: [
{text: "成都市"},
{text: "自贡市"},
{text: "攀枝花市"},
{text: "泸州市"},
{text: "德阳市"},
{text: "绵阳市"},
{text: "广元市"},
{text: "遂宁市"},
{text: "内江市"},
{text: "乐山市"},
{text: "南充市"},
{text: "眉山市"},
{text: "宜宾市"},
{text: "广安市"},
{text: "达州市"},
{text: "雅安市"},
{text: "巴中市"},
{text: "资阳市"},
{text: "阿坝藏族羌族自治州"},
{text: "甘孜藏族自治州"},
{text: "凉山彝族自治州"}
]
},
{
text: "贵州"
, City: [
{text: "贵阳市"},
{text: "六盘水市"},
{text: "遵义市"},
{text: "安顺市"},
{text: "铜仁地区"},
{text: "黔西南布依族苗族自治州"},
{text: "毕节地区"},
{text: "黔东南苗族侗族自治州"},
{text: "黔南布依族苗族自治州"}
]
},
{
text: "云南"
, City: [
{text: "昆明市"},
{text: "曲靖市"},
{text: "玉溪市"},
{text: "保山市"},
{text: "昭通市"},
{text: "丽江市"},
{text: "普洱市"},
{text: "临沧市"},
{text: "楚雄彝族自治州"},
{text: "红河哈尼族彝族自治州"},
{text: "文山壮族苗族自治州"},
{text: "西双版纳傣族自治州"},
{text: "大理白族自治州"},
{text: "德宏傣族景颇族自治州"},
{text: "怒江傈僳族自治州"},
{text: "迪庆藏族自治州"}
]
},
{
text: "西藏"
, City: [
{text: "拉萨市"},
{text: "昌都地区"},
{text: "山南地区"},
{text: "日喀则地区"},
{text: "那曲地区"},
{text: "阿里地区"},
{text: "林芝地区"}
]
},
{
text: "陕西"
, City: [
{text: "西安市"},
{text: "铜川市"},
{text: "宝鸡市"},
{text: "咸阳市"},
{text: "渭南市"},
{text: "延安市"},
{text: "汉中市"},
{text: "榆林市"},
{text: "安康市"},
{text: "商洛市"}
]
},
{
text: "甘肃"
, City: [
{text: "兰州市"},
{text: "嘉峪关市"},
{text: "金昌市"},
{text: "白银市"},
{text: "天水市"},
{text: "武威市"},
{text: "张掖市"},
{text: "平凉市"},
{text: "酒泉市"},
{text: "庆阳市"},
{text: "定西市"},
{text: "陇南市"},
{text: "临夏回族自治州"},
{text: "甘南藏族自治州"}
]
},
{
text: "青海"
, City: [
{text: "西宁市"},
{text: "海东地区"},
{text: "海北藏族自治州"},
{text: "黄南藏族自治州"},
{text: "海南藏族自治州"},
{text: "果洛藏族自治州"},
{text: "玉树藏族自治州"},
{text: "海西蒙古族藏族自治州"}
]
},
{
text: "宁夏"
, City: [
{text: "银川市"},
{text: "石嘴山市"},
{text: "吴忠市"},
{text: "固原市"},
{text: "中卫市"}
]
},
{
text: "新疆"
, City: [
{text: "乌鲁木齐市"},
{text: "克拉玛依市"},
{text: "吐鲁番地区"},
{text: "哈密地区"},
{text: "昌吉回族自治州"},
{text: "博尔塔拉蒙古自治州"},
{text: "巴音郭楞蒙古自治州"},
{text: "阿克苏地区"},
{text: "克孜勒苏柯尔克孜自治州"},
{text: "喀什地区"},
{text: "和田地区"},
{text: "伊犁哈萨克自治州"},
{text: "塔城地区"},
{text: "阿勒泰地区"}
]
},
{
text: "台湾"
, City: [
{text: "台北市"},
{text: "高雄市"},
{text: "基隆市"},
{text: "台中市"},
{text: "台南市"},
{text: "新竹市"},
{text: "嘉义市"},
{text: "台北县"},
{text: "宜兰县"},
{text: "桃园县"},
{text: "新竹县"},
{text: "苗栗县"},
{text: "台中县"},
{text: "彰化县"},
{text: "南投县"},
{text: "云林县"},
{text: "嘉义县"},
{text: "台南县"},
{text: "高雄县"},
{text: "屏东县"},
{text: "澎湖县"},
{text: "台东县"},
{text: "花莲县"}
]
},
{
text: "香港"
, City: [
{text: "中西区"},
{text: "东区"},
{text: "九龙城区"},
{text: "观塘区"},
{text: "南区"},
{text: "深水埗区"},
{text: "黄大仙区"},
{text: "湾仔区"},
{text: "油尖旺区"},
{text: "离岛区"},
{text: "葵青区"},
{text: "北区"},
{text: "西贡区"},
{text: "沙田区"},
{text: "屯门区"},
{text: "大埔区"},
{text: "荃湾区"},
{text: "元朗区"},
]
},
{
text: "澳门"
, City: [
{text: "花地玛堂区"},
{text: "圣安多尼堂区"},
{text: "大堂区"},
{text: "望德堂区"},
{text: "风顺堂区"},
{text: "氹仔"},
{text: "路环"},
]
},
{
text: "海外"
, City: [
{text: "美国"},
{text: "日本"},
{text: "英国"},
{text: "法国"},
{text: "法国"},
{text: "德国"},
{text: "韩国"},
{text: "加拿大"},
{text: "澳大利亚"},
{text: "新西兰"},
{text: "意大利"},
{text: "俄罗斯"},
{text: "乌克兰"},
{text: "新加坡"},
{text: "其他"}
]
} ]
c.数据交互部分（方法）
computed: {
selection: {
get: function() {
let that = this;
return this.Province.filter(function(item,index) {
return item.text == that.selected;
})[0].City;
}
},
},
二级数组省市表(二维数组json)的更多相关文章
- c语言中如何通过二级指针来操作二维数组
通过二级指针去访问二维数组需要先给二级指针分配等同于二维数组行数的一维数组指针,然后把二维数组的每行首地址赋值给对应位置的一维指针上.之后就可以通过二维指针直接访问了. 参考代码如下,可以看具体注释辅 ...
- 06-01 Java 二维数组格式、二维数组内存图解、二维数组操作
二维数组格式1 /* 二维数组:就是元素为一维数组的一个数组. 格式1: 数据类型[][] 数组名 = new 数据类型[m][n]; m:表示这个二维数组有多少个一维数组. n:表示每一个一维数组的 ...
- PHP如何判断一个数组是一维数组或者是二维数组？用什么函数？
如题:如何判断一个数组是一维数组或者是二维数组?用什么函数? 判断数量即可 <?php if (count($array) == count($array, 1)) { echo '是一维数组' ...
- C语言数组：C语言数组定义、二维数组、动态数组、字符串数组
1.C语言数组的概念 在<更加优美的C语言输出>一节中我们举了一个例子,是输出一个 4×4 的整数矩阵,代码如下: #include <stdio.h> #include &l ...
- oracle学习之路（四） ---------PL/SQL 表,二维数组(TABLE)
LOB类型 ORACLE提供了LOB (Large OBject)类型.用于存储大的数据对象的类型.ORACLE眼下主要支持BFILE, BLOB, CLOB 及 NCLOB 类型. NCLOB 存储 ...
- 20130330 printf数组改变 数组指针便利二维数组 二级指针遍历二维数组 ZigZag
1.为什么printf之后数组的值会改变? #include<stdio.h> ; int * Zigzag() { ,j=,limit=; ; ; int a[N][N]; int (* ...
- 计算机二级-C语言-对二维数组数据进行处理。对文件进行数据输入。形参与实参。
//函数fun的功能为:计算x所指数组中N个数的平均值(规定所有数都为正数),平均值通过形参返回给主函数,将小于平均值且最接近平均值的数作为函数值返回,并输出. //重难点:形参与实参之间,是否进行了 ...
- Java菜鸟学习笔记--数组篇(三):二维数组
定义 //1.二维数组的定义 //2.二维数组的内存空间 //3.不规则数组 package me.array; public class Array2Demo{ public static void ...
- c语言，指针与数组--指针与二维数组2
指向一维数组的指针 char (*p)[10] ;指向一维数组的指针类型 typedef char(*TYPE_P2ARRAY)[10] ; 该指针可以指向数组 ,且使用起来效果节本相同, ...
随机推荐
- advanceInstaller安装文件的ICON
修改以下配置 点击icon图标位置可重新选择
- php-resque 队列简单使用
一.安装 php-resque 进入项目根目录,composer 安装 php-resque composer require chrisboulton/php-resque 二.常用方法 1.连接 ...
- mysql数据库事务类型
出自:https://blog.csdn.net/u014439239/article/details/78086729 数据库事务有不同的隔离级别,不同的隔离级别对锁的使用是不同的,锁的应用最终导致 ...
- C# .net 提升 asp.net mvc, asp.net core mvc 并发量
1.提升System.Net.ServicePointManager.DefaultConnectionLimit 2.提升最小工作线程数 ------ DefaultConnectionLimit在 ...
- python：将时间戳格式化为yyyyMMdd hh:mm:ss
import time #将10位时间戳或者13位转换为时间字符串,默认为2017-10-01 13:37:04格式 def timestamp_to_date(time_stamp, format_ ...
- 【bat】【windows】通过端口杀死进程
简单的bat处理,把指定端口集合杀死相应的进程,就是杀死对应的pid @echo off & setlocal EnableDelayedExpansion ]= ]= ]= ]= ]= fo ...
- linux查看端口常用命令
netstat命令参数: -t : 指明显示TCP端口 -u : 指明显示UDP端口 -l : 仅显示监听套接字(所谓套接字就是使应用程序能够读写与收发通讯协议(protocol)与资料的程序) -p ...
- 008 SpringCloud 学习笔记4-----Ribbon负载均衡
1.Ribbon概述 实际环境中,我们往往会开启很多个itcast-service-provider的集群.此时我们获取的服务列表中就会有多个,到底该访问哪一个呢? Eureka中已经帮我们集成了负载 ...
- Python实现堆
堆 (heap) 是一种经过排序的完全二叉树,其中任一非叶子节点的值均不大于(或不小于)其左孩子和右孩子节点的值. 注:定义来自百度百科. 堆,又被为优先队列(priority queue).尽管名为 ...
- Java开发笔记（一百四十九）引入预报告的好处
前面介绍了各种SQL语句的调用过程,虽然例子代码写死了每个SQL串,但是完全可以把查询条件作为方法参数传进来.比如现在想删除某个课程的教师记录,那么在编写删除方法时,就把课程名称作为该方法的一个输入参 ...