element Cascader 级联选择器 动态加载 省市县 三级数据

需求:使用联级选择器展示省市县三级

如下图:

方法如下:请仔细阅读图片

通过lazy开启动态加载,并通过lazyload来设置加载数据源的方法。lazyload方法有两个参数,第一个参数node为当前点击的节点,第二个resolve为数据加载完成的回调(必须调用)。为了更准确的显示节点的状态,还可以对节点数据添加是否为叶子节点的标志位 (默认字段为leaf,可通过props.leaf修改),否则会简单的以有无子节点来判断是否为叶子节点。

联级选择器第一层数据,要么写死,要么通过数据获取,次处是通过数据获取的,:options="areaList" aireaList就是我们的数据。

:props="areaProps"是定义在data中的配置的属性,数据格式同样是value label样式。

如果省市县 数据是通过后台一个接口数据进行的返回,也可以不使用联级选择器。

详见:element Cascader 级联选择器使用及表单的校验_逆风优雅的博客-CSDN博客


版权声明:本文为qq_44603011原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。