博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
vue二级联动select
阅读量:6140 次
发布时间:2019-06-21

本文共 1196 字,大约阅读时间需要 3 分钟。

所在区域

vue data:

export default{    data(){      return {        countryName:"",        cityName:"",            area:[          {            "country":"美国",            "city":[              "纽约",              "洛杉矶",              "旧金山",              "西雅图",              "波士顿",              "休斯顿",              "圣地亚哥",              "芝加哥",              "其它",            ]          },          {            "country":"加拿大",            "city":[              "温哥华",              "多伦多",              "蒙特利尔",              "其它"            ]          },          {            "country":"澳大利亚",            "city":[              "悉尼",              "墨尔本",              "其它"            ]          },          {            "country":"新加坡",            "city":[              "新加坡"            ]          },          /*{           "country":"中国",           "city":[              "北京市",           ]           },*/        ],      }    },

 

实现原理:通过vue v-model 绑定获取到area当前的对象,让后city遍历的时候世界遍历当前获取到的国际的对象下的city就好,当需要向后台传值的,要传的是vue实例下 this.countryName.country

转载于:https://www.cnblogs.com/beileixinqing/p/8073899.html

你可能感兴趣的文章
软件概要设计做什么,怎么做
查看>>
dwr
查看>>
java的特殊符号
查看>>
word2010中去掉红色波浪线的方法
查看>>
fabric上下文管理器(context mangers)
查看>>
JQuery-EasyUI Datagrid数据行鼠标悬停/离开事件(onMouseOver/onMouseOut)
查看>>
并发和并行的区别
查看>>
php小知识
查看>>
Windows下安装、运行Lua
查看>>
Nginx 反向代理、负载均衡、页面缓存、URL重写及读写分离详解(二)
查看>>
初识中间件之消息队列
查看>>
MyBatis学习总结(三)——优化MyBatis配置文件中的配置
查看>>
Spring常用注解
查看>>
我的友情链接
查看>>
PCS子层有什么用?
查看>>
查看端口,关闭端口
查看>>
代码托管平台简介
查看>>
linux:yum和apt-get的区别
查看>>
Sentinel 1.5.0 正式发布,引入 Reactive 支持
查看>>
数据库之MySQL
查看>>