标签：margin cloud read methods APICloud text vue iconfont inpu
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"> <meta name="format-detection" content="telephone=no" /> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <title>费用计算</title> <link rel="stylesheet" href="../../css/framework7.ios.min.css"> <link rel="stylesheet" href="../../css/framework7.ios.colors.min.css"> <link rel="stylesheet" href="../../css/common.css" type="text/css" /> <link rel="stylesheet" href="../../css/mystyle.css" type="text/css" /> <link rel="stylesheet" href="https://at.alicdn.com/t/font_986272_jhe0du8l1es.css"> <style type="text/css"> [v-cloak] { display: none; } .i-y-text{ font-size: 1rem; color: #FFCC33; padding: 1rem 0 } .i-y-content{ font-size: 0.75rem; color: #FFCC33; padding: 1rem 0 } </style> </head> <body> <div class="views" id="app"> <div class="view view-main" id="header"> <div class="pages"> <div data-page="home" class="page navbar-fixed"> <!-- 顶部搜索 --> <div class="navbar"> <div class="navbar-inner"> <div class="left" onclick="closeApiWin(‘‘)"> <i class="iconfont iconfanhui"></i> </div> <div class="center">运费计算</div> <div class="right"> </div> </div> </div> <div class="page-content" v-cloak> <div class="i-l-box"> <div class="i-l-ipt"> <div>选择快递</div> <div class="i-l-ipt-sel"> <select v-model="kuaidi_id"> <option value="0">请选择</option> <option v-for="item in kuaidis" :value="item.id">{{item.name}}</option> </select> <i class="iconfonticonyoujiantou"></i> </div> </div> <div class="i-y-text">发件地</div> <div class="i-l-ipt"> <div>选择省</div> <div class="i-l-ipt-sel"> <select v-model="fromId">> <option value="0">请选择省</option> <option v-for="item in areas" :value="item.id">{{item.name}}</option> </select> <i class="iconfonticonyoujiantou"></i> </div> </div> <div class="i-l-ipt"> <div>选择市</div> <div class="i-l-ipt-sel"> <select v-model="fromId2">> <option value="0">请选择市</option> <option v-for="item in fromArea2" :value="item.id">{{item.name}}</option> </select> <i class="iconfonticonyoujiantou"></i> </div> </div> <div class="i-y-text">收件地</div> <div class="i-l-ipt"> <div>选择省</div> <div class="i-l-ipt-sel"> <select v-model="toId"> <option value="0">请选择省</option> <option v-for="item in areas" :value="item.id">{{item.name}}</option> </select> <i class="iconfonticonyoujiantou"></i> </div> </div> <div class="i-l-ipt"> <div>选择市</div> <div class="i-l-ipt-sel"> <select v-model="toId2">> <option value="0">请选择市</option> <option v-for="item in toArea2" :value="item.id">{{item.name}}</option> </select> <i class="iconfonticonyoujiantou"></i> </div> </div> <div class="i-l-ipt"> <div>重量(kg)</div> <input type="number" v-model="weight" placeholder="请输入快递重量"> </div> <div class="i-y-text">费用</div> <div class="i-l-ipt"> <div>费用(元)</div> <input type="number" v-model="fee" readonly> </div> <div class="i-y-content">注意：因各品牌，各地区运营策略不同，运费预估仅做参考，具体费用以快递员报价为准</div> <button style=‘margin-top:1.5rem;‘ class="i-l-btn" type="button" name="button" @click="calculateYunfei">计算</button> </div> <!-- <div class="list-block"> <ul> <li class="align-top"> <div class="item-content"> <div class="item-inner"> <div class="item-title label" style="color:#999;font-size:14px;">请选择品牌</div> <div class="item-input"> <select v-model="kuaidi_id"> <option value="0">请选择</option> <option v-for="item in kuaidis" :value="item.id">{{item.name}}</option> </select> </div> </div> </div> </li> <li class="align-top"> <div class="item-content"> <div class="item-inner"> <div class="item-title label" style="color:#999;font-size:14px;">发件地址</div> <div class="item-input"> <select v-model="fromId">> <option value="0">请选择省</option> <option v-for="item in areas" :value="item.id">{{item.name}}</option> </select> <select v-model="fromId2">> <option value="0">请选择市</option> <option v-for="item in fromArea2" :value="item.id">{{item.name}}</option> </select> </div> </div> </div> </li> <li class="align-top"> <div class="item-content"> <div class="item-inner"> <div class="item-title label" style="color:#999;font-size:14px;">收件地址</div> <div class="item-input"> <select v-model="toId"> <option value="0">请选择省</option> <option v-for="item in areas" :value="item.id">{{item.name}}</option> </select> <select v-model="toId2">> <option value="0">请选择市</option> <option v-for="item in toArea2" :value="item.id">{{item.name}}</option> </select> </div> </div> </div> </li> <li class="align-top"> <div class="item-content"> <div class="item-inner"> <div class="item-title label" style="color:#999;font-size:14px;">重量</div> <div class="item-input"> <input placeholder="请输入重量(单位:千克)" v-model="weight" type="number" style="text-align: right"> </div> <div class="item-after"> Kg </div> </div> </div> </li> <li class="align-top"> <div class="item-content"> <div class="item-inner"> <div class="item-input"> <button type="button" style="margin-top: 5px;font-size: 16px;width:100px;height:35px;background:#10893E;color:#fff;border:none;" @click="calculateYunfei()">计算</button> </div> </div> </div> </li> <li> <div class="item-content"> <div class="item-inner"> <div class="item-title label" style="color:#999;font-size:14px;">费用</div> <div class="item-after"> <div class="badge" style="font-size:18px;background-color:#10893E;">{{fee}}</div>元 </div> </div> </div> </li> <li> <div class="item-content"> <div class="item-text" style="width:90%;padding:10px;">注意：因各品牌，各地区运营策略不同，运费预估仅做参考，具体费用以快递员报价为准</div> </div> </li> </ul> </div> --> </div> </div> </div> </div> </div> <script src="../../script/framework7.min.js"></script> <script src="../../script/api.js"></script> <script src="../../script/common.js"></script> <script src="../../script/vue.min.js"></script> <script src="../../script/area.js"></script> <script type="text/javascript"> var app; var myApp, mainView; // apiready = function() { // ShiPeiStatusBar(); //适配顶部状态栏 myApp = new Framework7({ statusbarOverlay: false }); //保证导航栏中间的字居中 mainView = myApp.addView(‘.view-main‘, { dynamicNavbar: true }); app = new Vue({ el: ‘#app‘, data: { areas: [], kuaidis: [], fromArea2: [], toArea2: [], fromId: 0, fromId2: 0, toId: 0, toId2: 0, kuaidi_id: 0, fee: 0, weight: 0.00 }, watch: { fromId: function(newValue) { this.fromId2 = 0; if (this.formId == 0) { this.formArea2 = []; } for (i in this.areas) { console.log(JSON.stringify(this.areas[i][‘id‘])) if (this.areas[i][‘id‘] == newValue) { this.fromArea2 = this.areas[i][‘childs‘]; } } }, toId: function(newValue) { this.toId2 = 0; if (this.toId == 0) { this.toArea2 = []; } for (i in this.areas) { if (this.areas[i].id == newValue) { this.toArea2 = this.areas[i].childs; } } }, }, methods: { getAreas: function() { this.areas = window.areaData; }, getKuaidis: function() { this.kuaidis = [{ "id": 1, "name": "邮政包裹/平邮", "bianhao": "pingyou", "log": "https://cdn.kuaidi100.com/images/all/56/youzhengguonei.png", ‘nearfee‘: 10, ‘farfee‘: 20, ‘nearplus‘: 2, ‘farplus‘: 4, ‘daofuplus‘: 5 }, { "id": 2, "name": "EMS", "bianhao": "ems", "log": "https://cdn.kuaidi100.com/images/all/56/ems.png", ‘nearfee‘: 10, ‘farfee‘: 20, ‘nearplus‘: 2, ‘farplus‘: 4, ‘daofuplus‘: 5 }, { "id": 3, "name": "顺丰", "bianhao": "shunfeng", "log": "https://cdn.kuaidi100.com/images/all/56/shunfeng.png", ‘nearfee‘: 10, ‘farfee‘: 20, ‘nearplus‘: 2, ‘farplus‘: 4, ‘daofuplus‘: 5 }, { "id": 4, "name": "申通", "bianhao": "shentong", "log": "https://cdn.kuaidi100.com/images/all/56/shentong.png", ‘nearfee‘: 10, ‘farfee‘: 20, ‘nearplus‘: 2, ‘farplus‘: 4, ‘daofuplus‘: 5 }, { "id": 5, "name": "圆通", "bianhao": "yuantong", "log": "https://cdn.kuaidi100.com/images/all/56/yuantong.png", ‘nearfee‘: 10, ‘farfee‘: 20, ‘nearplus‘: 2, ‘farplus‘: 4, ‘daofuplus‘: 5 }, { "id": 6, "name": "中通", "bianhao": "zhongtong", "log": "https://cdn.kuaidi100.com/images/all/56/zhongtong.png", ‘nearfee‘: 10, ‘farfee‘: 20, ‘nearplus‘: 2, ‘farplus‘: 4, ‘daofuplus‘: 5 }, { "id": 7, "name": "汇通", "bianhao": "huitong", "log": "https://cdn.kuaidi100.com/images/all/56/huitongkuaidi.png", ‘nearfee‘: 10, ‘farfee‘: 20, ‘nearplus‘: 2, ‘farplus‘: 4, ‘daofuplus‘: 5 }, { "id": 8, "name": "韵达", "bianhao": "yunda", "log": "https://cdn.kuaidi100.com/images/all/56/yunda.png", ‘nearfee‘: 10, ‘farfee‘: 20, ‘nearplus‘: 2, ‘farplus‘: 4, ‘daofuplus‘: 5 }, { "id": 9, "name": "天天", "bianhao": "tiantian", "log": "https://cdn.kuaidi100.com/images/all/56/tiantian.png", ‘nearfee‘: 10, ‘farfee‘: 20, ‘nearplus‘: 2, ‘farplus‘: 4, ‘daofuplus‘: 5 }, { "id": 10, "name": "宅急送", "bianhao": "zhaijisong", "log": "https://cdn.kuaidi100.com/images/all/56/zhaijisong.png", ‘nearfee‘: 10, ‘farfee‘: 20, ‘nearplus‘: 2, ‘farplus‘: 4, ‘daofuplus‘: 5 }, { "id": 11, "name": "京东", "bianhao": "jd", "log": "https://cdn.kuaidi100.com/images/all/56/jd.png", ‘nearfee‘: 10, ‘farfee‘: 20, ‘nearplus‘: 2, ‘farplus‘: 4, ‘daofuplus‘: 5 }, { "id": 12, "name": "优速", "bianhao": "yousu", "log": "https://cdn.kuaidi100.com/images/all/56/youshuwuliu.png", ‘nearfee‘: 10, ‘farfee‘: 20, ‘nearplus‘: 2, ‘farplus‘: 4, ‘daofuplus‘: 5 }, { "id": 13, "name": "全峰", "bianhao": "quanfeng", "log": "https://cdn.kuaidi100.com/images/all/56/quanfengkuaidi.png", ‘nearfee‘: 10, ‘farfee‘: 20, ‘nearplus‘: 2, ‘farplus‘: 4, ‘daofuplus‘: 5 }, { "id": 14, "name": "德邦", "bianhao": "debang", "log": "https://cdn.kuaidi100.com/images/all/56/debangwuliu.png", ‘nearfee‘: 10, ‘farfee‘: 20, ‘nearplus‘: 2, ‘farplus‘: 4, ‘daofuplus‘: 5 }] }, calculateYunfei: function() { var kuaidi = {} if (!this.kuaidi_id) { api.alert({ title: ‘错误‘, msg: ‘请选择快递品牌‘ }) return false; } if (this.kuaidi_id) { for (i in this.kuaidis) { if (this.kuaidis[i].id == this.kuaidi_id) { kuaidi = this.kuaidis[i]; } } } if (!kuaidi) { api.alert({ title: ‘错误‘, msg: ‘请选择快递品牌‘ }) return false; } if (!this.fromId || !this.fromId2) { api.alert({ title: ‘错误‘, msg: ‘请选择寄件地址‘ }) return false; } if (!this.toId || !this.toId2) { api.alert({ title: ‘错误‘, msg: ‘请选择收件地址‘ }) return false; } if (this.weight < 0.01) { api.alert({ title: ‘错误‘, msg: ‘请输入货品重量‘ }) return false; } var danjia = 0; var plus = 0; var daofu = kuaidi.daofuplus; if (this.fromId == this.toId) { danjia = kuaidi.nearfee; plus = kuaidi.nearplus; } else { danjia = kuaidi.farfee; plus = kuaidi.farplus; } if (this.weight > 1) { this.fee = (danjia + plus * Math.ceil(this.weight - 1)).toFixed(2) } else { this.fee = danjia.toFixed(2) } } }, mounted: function() { this.getAreas(); this.getKuaidis() } }) // } </script> </body> </html>
//缺少 港澳台 海外和 西藏 新疆 window.areaData = [ { "id": 1, "name": "北京", "childs": [ { "id": 36, "name": "北京市" } ] }, { "id": 2, "name": "天津", "childs": [ { "id": 40, "name": "天津市" } ] }, { "id": 3, "name": "河北省", "childs": [ { "id": 73, "name": "石家庄市" }, { "id": 74, "name": "唐山市" }, { "id": 75, "name": "秦皇岛市" }, { "id": 76, "name": "邯郸市" }, { "id": 77, "name": "邢台市" }, { "id": 78, "name": "保定市" }, { "id": 79, "name": "张家口市" }, { "id": 80, "name": "承德市" }, { "id": 81, "name": "衡水市" }, { "id": 82, "name": "廊坊市" }, { "id": 83, "name": "沧州市" } ] }, { "id": 4, "name": "山西省", "childs": [ { "id": 84, "name": "太原市" }, { "id": 85, "name": "大同市" }, { "id": 86, "name": "阳泉市" }, { "id": 87, "name": "长治市" }, { "id": 88, "name": "晋城市" }, { "id": 89, "name": "朔州市" }, { "id": 90, "name": "晋中市" }, { "id": 91, "name": "运城市" }, { "id": 92, "name": "忻州市" }, { "id": 93, "name": "临汾市" }, { "id": 94, "name": "吕梁市" } ] }, { "id": 5, "name": "内蒙古自治区", "childs": [ { "id": 95, "name": "呼和浩特市" }, { "id": 96, "name": "包头市" }, { "id": 97, "name": "乌海市" }, { "id": 98, "name": "赤峰市" }, { "id": 99, "name": "通辽市" }, { "id": 100, "name": "鄂尔多斯市" }, { "id": 101, "name": "呼伦贝尔市" }, { "id": 102, "name": "巴彦淖尔市" }, { "id": 103, "name": "乌兰察布市" }, { "id": 104, "name": "兴安盟" }, { "id": 105, "name": "锡林郭勒盟" }, { "id": 106, "name": "阿拉善盟" } ] }, { "id": 6, "name": "辽宁省", "childs": [ { "id": 107, "name": "沈阳市" }, { "id": 108, "name": "大连市" }, { "id": 109, "name": "鞍山市" }, { "id": 110, "name": "抚顺市" }, { "id": 111, "name": "本溪市" }, { "id": 112, "name": "丹东市" }, { "id": 113, "name": "锦州市" }, { "id": 114, "name": "营口市" }, { "id": 115, "name": "阜新市" }, { "id": 116, "name": "辽阳市" }, { "id": 117, "name": "盘锦市" }, { "id": 118, "name": "铁岭市" }, { "id": 119, "name": "朝阳市" }, { "id": 120, "name": "葫芦岛市" } ] }, { "id": 7, "name": "吉林省", "childs": [ { "id": 121, "name": "长春市" }, { "id": 122, "name": "吉林市" }, { "id": 123, "name": "四平市" }, { "id": 124, "name": "辽源市" }, { "id": 125, "name": "通化市" }, { "id": 126, "name": "白山市" }, { "id": 127, "name": "松原市" }, { "id": 128, "name": "白城市" }, { "id": 129, "name": "延边朝鲜族自治州" } ] }, { "id": 8, "name": "黑龙江省", "childs": [ { "id": 130, "name": "哈尔滨市" }, { "id": 131, "name": "齐齐哈尔市" }, { "id": 132, "name": "鸡西市" }, { "id": 133, "name": "鹤岗市" }, { "id": 134, "name": "双鸭山市" }, { "id": 135, "name": "大庆市" }, { "id": 136, "name": "伊春市" }, { "id": 137, "name": "佳木斯市" }, { "id": 138, "name": "七台河市" }, { "id": 139, "name": "牡丹江市" }, { "id": 140, "name": "黑河市" }, { "id": 141, "name": "绥化市" }, { "id": 142, "name": "大兴安岭地区" } ] }, { "id": 9, "name": "上海", "childs": [ { "id": 39, "name": "上海市" } ] }, { "id": 10, "name": "江苏省", "childs": [ { "id": 162, "name": "南京市" }, { "id": 163, "name": "无锡市" }, { "id": 164, "name": "徐州市" }, { "id": 165, "name": "常州市" }, { "id": 166, "name": "苏州市" }, { "id": 167, "name": "南通市" }, { "id": 168, "name": "连云港市" }, { "id": 169, "name": "淮安市" }, { "id": 170, "name": "盐城市" }, { "id": 171, "name": "扬州市" }, { "id": 172, "name": "镇江市" }, { "id": 173, "name": "泰州市" }, { "id": 174, "name": "宿迁市" } ] }, { "id": 11, "name": "浙江省", "childs": [ { "id": 175, "name": "杭州市" }, { "id": 176, "name": "宁波市" }, { "id": 177, "name": "温州市" }, { "id": 178, "name": "嘉兴市" }, { "id": 179, "name": "湖州市" }, { "id": 180, "name": "绍兴市" }, { "id": 181, "name": "舟山市" }, { "id": 182, "name": "衢州市" }, { "id": 183, "name": "金华市" }, { "id": 184, "name": "台州市" }, { "id": 185, "name": "丽水市" } ] }, { "id": 12, "name": "安徽省", "childs": [ { "id": 186, "name": "合肥市" }, { "id": 187, "name": "芜湖市" }, { "id": 188, "name": "蚌埠市" }, { "id": 189, "name": "淮南市" }, { "id": 190, "name": "马鞍山市" }, { "id": 191, "name": "淮北市" }, { "id": 192, "name": "铜陵市" }, { "id": 193, "name": "安庆市" }, { "id": 194, "name": "黄山市" }, { "id": 195, "name": "滁州市" }, { "id": 196, "name": "阜阳市" }, { "id": 197, "name": "宿州市" }, { "id": 198, "name": "巢湖市" }, { "id": 199, "name": "六安市" }, { "id": 200, "name": "亳州市" }, { "id": 201, "name": "池州市" }, { "id": 202, "name": "宣城市" } ] }, { "id": 13, "name": "福建省", "childs": [ { "id": 203, "name": "福州市" }, { "id": 204, "name": "厦门市" }, { "id": 205, "name": "莆田市" }, { "id": 206, "name": "三明市" }, { "id": 207, "name": "泉州市" }, { "id": 208, "name": "漳州市" }, { "id": 209, "name": "南平市" }, { "id": 210, "name": "龙岩市" }, { "id": 211, "name": "宁德市" } ] }, { "id": 14, "name": "江西省", "childs": [ { "id": 212, "name": "南昌市" }, { "id": 213, "name": "景德镇市" }, { "id": 214, "name": "萍乡市" }, { "id": 215, "name": "九江市" }, { "id": 216, "name": "新余市" }, { "id": 217, "name": "鹰潭市" }, { "id": 218, "name": "赣州市" }, { "id": 219, "name": "吉安市" }, { "id": 220, "name": "宜春市" }, { "id": 221, "name": "抚州市" }, { "id": 222, "name": "上饶市" } ] }, { "id": 15, "name": "山东省", "childs": [ { "id": 223, "name": "济南市" }, { "id": 224, "name": "青岛市" }, { "id": 225, "name": "淄博市" }, { "id": 226, "name": "枣庄市" }, { "id": 227, "name": "东营市" }, { "id": 228, "name": "烟台市" }, { "id": 229, "name": "潍坊市" }, { "id": 230, "name": "济宁市" }, { "id": 231, "name": "泰安市" }, { "id": 232, "name": "威海市" }, { "id": 233, "name": "日照市" }, { "id": 234, "name": "莱芜市" }, { "id": 235, "name": "临沂市" }, { "id": 236, "name": "德州市" }, { "id": 237, "name": "聊城市" }, { "id": 238, "name": "滨州市" }, { "id": 239, "name": "菏泽市" } ] }, { "id": 16, "name": "河南省", "childs": [ { "id": 240, "name": "郑州市" }, { "id": 241, "name": "开封市" }, { "id": 242, "name": "洛阳市" }, { "id": 243, "name": "平顶山市" }, { "id": 244, "name": "安阳市" }, { "id": 245, "name": "鹤壁市" }, { "id": 246, "name": "新乡市" }, { "id": 247, "name": "焦作市" }, { "id": 248, "name": "濮阳市" }, { "id": 249, "name": "许昌市" }, { "id": 250, "name": "漯河市" }, { "id": 251, "name": "三门峡市" }, { "id": 252, "name": "南阳市" }, { "id": 253, "name": "商丘市" }, { "id": 254, "name": "信阳市" }, { "id": 255, "name": "周口市" }, { "id": 256, "name": "驻马店市" }, { "id": 257, "name": "济源市" } ] }, { "id": 17, "name": "湖北省", "childs": [ { "id": 258, "name": "武汉市" }, { "id": 259, "name": "黄石市" }, { "id": 260, "name": "十堰市" }, { "id": 261, "name": "宜昌市" }, { "id": 262, "name": "襄阳市" }, { "id": 263, "name": "鄂州市" }, { "id": 264, "name": "荆门市" }, { "id": 265, "name": "孝感市" }, { "id": 266, "name": "荆州市" }, { "id": 267, "name": "黄冈市" }, { "id": 268, "name": "咸宁市" }, { "id": 269, "name": "随州市" }, { "id": 270, "name": "恩施土家族苗族自治州" }, { "id": 271, "name": "仙桃市" }, { "id": 272, "name": "潜江市" }, { "id": 273, "name": "天门市" }, { "id": 274, "name": "神农架林区" } ] }, { "id": 18, "name": "湖南省", "childs": [ { "id": 275, "name": "长沙市" }, { "id": 276, "name": "株洲市" }, { "id": 277, "name": "湘潭市" }, { "id": 278, "name": "衡阳市" }, { "id": 279, "name": "邵阳市" }, { "id": 280, "name": "岳阳市" }, { "id": 281, "name": "常德市" }, { "id": 282, "name": "张家界市" }, { "id": 283, "name": "益阳市" }, { "id": 284, "name": "郴州市" }, { "id": 285, "name": "永州市" }, { "id": 286, "name": "怀化市" }, { "id": 287, "name": "娄底市" }, { "id": 288, "name": "湘西土家族苗族自治州" } ] }, { "id": 19, "name": "广东省", "childs": [ { "id": 289, "name": "广州市" }, { "id": 290, "name": "韶关市" }, { "id": 291, "name": "深圳市" }, { "id": 292, "name": "珠海市" }, { "id": 293, "name": "汕头市" }, { "id": 294, "name": "佛山市" }, { "id": 295, "name": "江门市" }, { "id": 296, "name": "湛江市" }, { "id": 297, "name": "茂名市" }, { "id": 298, "name": "肇庆市" }, { "id": 299, "name": "惠州市" }, { "id": 300, "name": "梅州市" }, { "id": 301, "name": "汕尾市" }, { "id": 302, "name": "河源市" }, { "id": 303, "name": "阳江市" }, { "id": 304, "name": "清远市" }, { "id": 305, "name": "东莞市" }, { "id": 306, "name": "中山市" }, { "id": 307, "name": "潮州市" }, { "id": 308, "name": "揭阳市" }, { "id": 309, "name": "云浮市" } ] }, { "id": 20, "name": "广西壮族自治区", "childs": [ { "id": 310, "name": "南宁市" }, { "id": 311, "name": "柳州市" }, { "id": 312, "name": "桂林市" }, { "id": 313, "name": "梧州市" }, { "id": 314, "name": "北海市" }, { "id": 315, "name": "防城港市" }, { "id": 316, "name": "钦州市" }, { "id": 317, "name": "贵港市" }, { "id": 318, "name": "玉林市" }, { "id": 319, "name": "百色市" }, { "id": 320, "name": "贺州市" }, { "id": 321, "name": "河池市" }, { "id": 322, "name": "来宾市" }, { "id": 323, "name": "崇左市" } ] }, { "id": 21, "name": "海南省", "childs": [ { "id": 324, "name": "海口市" }, { "id": 325, "name": "三亚市" }, { "id": 326, "name": "五指山市" }, { "id": 327, "name": "琼海市" }, { "id": 328, "name": "儋州市" }, { "id": 329, "name": "文昌市" }, { "id": 330, "name": "万宁市" }, { "id": 331, "name": "东方市" }, { "id": 332, "name": "定安县" }, { "id": 333, "name": "屯昌县" }, { "id": 334, "name": "澄迈县" }, { "id": 335, "name": "临高县" }, { "id": 336, "name": "白沙黎族自治县" }, { "id": 337, "name": "昌江黎族自治县" }, { "id": 338, "name": "乐东黎族自治县" }, { "id": 339, "name": "陵水黎族自治县" }, { "id": 340, "name": "保亭黎族苗族自治县" }, { "id": 341, "name": "琼中黎族苗族自治县" }, { "id": 342, "name": "西沙群岛" }, { "id": 343, "name": "南沙群岛" }, { "id": 344, "name": "中沙群岛的岛礁及其海域" } ] }, { "id": 22, "name": "重庆", "childs": [ { "id": 62, "name": "重庆市" } ] }, { "id": 23, "name": "四川省", "childs": [ { "id": 385, "name": "成都市" }, { "id": 386, "name": "自贡市" }, { "id": 387, "name": "攀枝花市" }, { "id": 388, "name": "泸州市" }, { "id": 389, "name": "德阳市" }, { "id": 390, "name": "绵阳市" }, { "id": 391, "name": "广元市" }, { "id": 392, "name": "遂宁市" }, { "id": 393, "name": "内江市" }, { "id": 394, "name": "乐山市" }, { "id": 395, "name": "南充市" }, { "id": 396, "name": "眉山市" }, { "id": 397, "name": "宜宾市" }, { "id": 398, "name": "广安市" }, { "id": 399, "name": "达州市" }, { "id": 400, "name": "雅安市" }, { "id": 401, "name": "巴中市" }, { "id": 402, "name": "资阳市" }, { "id": 403, "name": "阿坝藏族羌族自治州" }, { "id": 404, "name": "甘孜藏族自治州" }, { "id": 405, "name": "凉山彝族自治州" } ] }, { "id": 24, "name": "贵州省", "childs": [ { "id": 406, "name": "贵阳市" }, { "id": 407, "name": "六盘水市" }, { "id": 408, "name": "遵义市" }, { "id": 409, "name": "安顺市" }, { "id": 410, "name": "铜仁地区" }, { "id": 411, "name": "黔西南布依族苗族自治州" }, { "id": 412, "name": "毕节地区" }, { "id": 413, "name": "黔东南苗族侗族自治州" }, { "id": 414, "name": "黔南布依族苗族自治州" } ] }, { "id": 25, "name": "云南省", "childs": [ { "id": 415, "name": "昆明市" }, { "id": 416, "name": "曲靖市" }, { "id": 417, "name": "玉溪市" }, { "id": 418, "name": "保山市" }, { "id": 419, "name": "昭通市" }, { "id": 420, "name": "丽江市" }, { "id": 421, "name": "普洱市" }, { "id": 422, "name": "临沧市" }, { "id": 423, "name": "楚雄彝族自治州" }, { "id": 424, "name": "红河哈尼族彝族自治州" }, { "id": 425, "name": "文山壮族苗族自治州" }, { "id": 426, "name": "西双版纳傣族自治州" }, { "id": 427, "name": "大理白族自治州" }, { "id": 428, "name": "德宏傣族景颇族自治州" }, { "id": 429, "name": "怒江傈僳族自治州" }, { "id": 430, "name": "迪庆藏族自治州" } ] }, { "id": 27, "name": "陕西省", "childs": [ { "id": 438, "name": "西安市" }, { "id": 439, "name": "铜川市" }, { "id": 440, "name": "宝鸡市" }, { "id": 441, "name": "咸阳市" }, { "id": 442, "name": "渭南市" }, { "id": 443, "name": "延安市" }, { "id": 444, "name": "汉中市" }, { "id": 445, "name": "榆林市" }, { "id": 446, "name": "安康市" }, { "id": 447, "name": "商洛市" } ] }, { "id": 28, "name": "甘肃省", "childs": [ { "id": 448, "name": "兰州市" }, { "id": 449, "name": "嘉峪关市" }, { "id": 450, "name": "金昌市" }, { "id": 451, "name": "白银市" }, { "id": 452, "name": "天水市" }, { "id": 453, "name": "武威市" }, { "id": 454, "name": "张掖市" }, { "id": 455, "name": "平凉市" }, { "id": 456, "name": "酒泉市" }, { "id": 457, "name": "庆阳市" }, { "id": 458, "name": "定西市" }, { "id": 459, "name": "陇南市" }, { "id": 460, "name": "临夏回族自治州" }, { "id": 461, "name": "甘南藏族自治州" } ] }, { "id": 29, "name": "青海省", "childs": [ { "id": 462, "name": "西宁市" }, { "id": 463, "name": "海东地区" }, { "id": 464, "name": "海北藏族自治州" }, { "id": 465, "name": "黄南藏族自治州" }, { "id": 466, "name": "海南藏族自治州" }, { "id": 467, "name": "果洛藏族自治州" }, { "id": 468, "name": "玉树藏族自治州" }, { "id": 469, "name": "海西蒙古族藏族自治州" } ] }, { "id": 30, "name": "宁夏回族自治区", "childs": [ { "id": 470, "name": "银川市" }, { "id": 471, "name": "石嘴山市" }, { "id": 472, "name": "吴忠市" }, { "id": 473, "name": "固原市" }, { "id": 474, "name": "中卫市" } ] } ]
标签：margin cloud read methods APICloud text vue iconfont inpu
原文地址：https://www.cnblogs.com/shark1100913/p/11302247.html
