iView Cascader 级联选择器怎么动态加载数据?

UP主~素香 阅读 52

我在用 iView 的 Cascader 组件做省市区三级联动,但数据量太大不想一次性加载完,想点一级才加载下一级。官方文档里说可以用 loadData,但我试了没反应,控制台也不报错。

我绑定了 :load-data="loadData",函数也写了,但点击展开时根本没触发。是不是还要配合 lazy 属性?或者我的数据结构不对?

loadData(item, callback) {
  setTimeout(() => {
    const children = [{ value: '101', label: '杭州市', loading: false }];
    item.children = children;
    callback();
  }, 1000);
}
我来解答 赞 7 收藏
二维码
手机扫码查看
1 条解答
司徒凌薇
你少加了 lazy 属性。

iView 的 Cascader 要动态加载必须配合 lazy 用,而且初始数据别带 children。改一下:

<Cascader 
:data="data"
:load-data="loadData"
lazy
></Cascader>


data 初始只有省这一级,区县别预先放进去。loadData 里拿到 item 后根据它的 value 去请求下一级数据,最后一定要调 callback()。
点赞
2026-03-16 16:02