vue+element下拉框实现 三级联动
要求实现三个带搜索的 下拉框 的三级联动, element 里的下拉框带搜索,可以实现,就是三级联动需要自己实现给到 三个接口,1,获取小区list 2, 获取该小区楼栋号 3,获取楼栋下的房间号实现如下:因为涉及到回填,所以 页面一加载就要获取 url 的小区id,...
·
要求实现三个带搜索的 下拉框 的三级联动, element 里的下拉框带搜索,可以实现,就是三级联动需要自己实现
给到 三个接口,1,获取小区list
2, 获取该小区楼栋号
3,获取楼栋下的房间号
实现如下:
因为涉及到回填,所以 页面一加载就要获取 url 的小区id,
mounted 发起请求, 请求所有小区, 所有小区赋值给 this.villagList ,
(!!! 在请求的里获取url里的小区编号,不然会出现 小区的下拉框只会出现value,不会更新为该value所指向的label !!!)
因为是 三级联动,所以 是要先拿到小区id,再去执行 this.getAllbuilding() 获取该小区底下的所有楼栋, 后面获取 房间号 也一样。
下面实现的 就是 改变value值,实现 联动, 给下拉框绑定change事件,
这里已经实现了, 切换下拉框,data会发生变化,但是实际情况中, 页面的展示没有更新, 也就是 切换了小区或者楼栋, 后面联动的下拉框的数据没有实实的更新,所以使用watch 深度监听那三个 数组
更多推荐
已为社区贡献2条内容
所有评论(0)