要求实现三个带搜索的 下拉框 的三级联动, element 里的下拉框带搜索,可以实现,就是三级联动需要自己实现

给到 三个接口,1,获取小区list 

                          2, 获取该小区楼栋号

                          3,获取楼栋下的房间号

实现如下:

因为涉及到回填,所以 页面一加载就要获取 url 的小区id,

mounted 发起请求, 请求所有小区, 所有小区赋值给 this.villagList ,

(!!! 在请求的里获取url里的小区编号,不然会出现 小区的下拉框只会出现value,不会更新为该value所指向的label !!!)

 因为是 三级联动,所以 是要先拿到小区id,再去执行 this.getAllbuilding() 获取该小区底下的所有楼栋, 后面获取 房间号 也一样。

 

下面实现的 就是 改变value值,实现 联动, 给下拉框绑定change事件,

这里已经实现了, 切换下拉框,data会发生变化,但是实际情况中, 页面的展示没有更新, 也就是 切换了小区或者楼栋, 后面联动的下拉框的数据没有实实的更新,所以使用watch 深度监听那三个 数组

 

GitHub 加速计划 / eleme / element
54.06 K
14.63 K
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:1 个月前 )
c345bb45 5 个月前
a07f3a59 * Update transition.md * Update table.md * Update transition.md * Update table.md * Update transition.md * Update table.md * Update table.md * Update transition.md * Update popover.md 5 个月前
Logo

旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐