如何解决Vue中Treeselect选择树动态构建巨树数据的问题？

本文共计1359个文字，预计阅读时间需要6分钟。

目录

一、后台构建两个数据选择查询功能

二、在VUE中引入Treeselect组件

三、使用Treeselect组件

四、构建初始的省级行政目录

五、构建动态生成的二、三、四级目录

六、最终效果

目录

• 一、后台构建两个表的数据选择查询功能
• 二、在VUE中引入Treeselect
• 三、使用Treeselect组件
• 四、构建初始的省级目录
• 五、构建动态生成的二、三、四级目录
• 六、最后效果

今天在项目中需要通过行政区域选择，然后选择该行政区域下面的景区，也就是要构建行政区划、景区两表数据表的树。

全国的行政区域到县已经3500多了，再加上景区会有几万个点，这棵选择树不论是在后台还是在前台构建都比较大，会影响系统性能，需要前后端结合，动态构建，使用时用懒加载，提升系统性能。

一、后台构建两个表的数据选择查询功能

1、行政区域需要按省、市、县的adcode和级别查询，以便于动态构建。

两个参数，adcode后台查询时会将后面的0去掉匹配，级别如果0或空，查询匹配下所有的，为数字只查本级。