使用el-tree来展示机构信息,然后传给后台用来作为查询条件。最初版本是把所有选中的节点都传给后端,后端使用in的方式来查询数据。这就出现一个问题,如果选中的是根节点,就会把整棵树的数据都传给后端,sql执行性能差。

后端提出要求,如果子节点都选中了,就不要传子节点了,只要把父节点的信息传出去。翻烂了element-ui文档,也没找到现成的方法。只能自己写了,具体代码如下(参考了element-ui tree的源码)

getSimpleCheckedNodes(store) {
	const checkedNodes = [];
	const traverse = function(node) {
		const childNodes = node.root ? node.root.childNodes : node.childNodes;
	
		childNodes.forEach(child => {
			if (child.checked) {
				checkedNodes.push(child.data);
			}
			if (child.indeterminate) {
				traverse(child);
			}
		});
	};
	traverse(store)
	return checkedNodes;
}

....
// 调用
getSimpleCheckedNodes(this.$refs.tree.store);// el-tree的ref是tree

希望能帮助到需要的朋友,有用请点赞,嘻嘻:)

GitHub 加速计划 / eleme / element
14
2
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:2 个月前 )
c345bb45 1 年前
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 1 年前
Logo

新一代开源开发者平台 GitCode,通过集成代码托管服务、代码仓库以及可信赖的开源组件库,让开发者可以在云端进行代码托管和开发。旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐