基于elementu的Transfer组件实现上移下移功能

又被调去改项目bug了,心累。简单的改个字就行,不简单的,就是有了按钮,让你去做逻辑。偏偏你原来不是这个项目组的,所以根本不懂他的逻辑。下面说的这个问题是介于两者之间的,既不简单,还有点逻辑。

原型就是下面这样:

基于elementu的Transfer组件实现上移下移功能

但是他在这个基础上还有选中项上移下移的功能。想法是好的,你倒给实现了啊,只想不说那是项目经理啊哥哥。

这里如果简单想的话,就是遍历所有项,然后判断是否选中,如果选中就操作,没有就跳过。有坑如下:

1、上移操作,遍历是从0-最后,没毛病。下移操作,就是从最后-0了,因为如果按照0-最后这样的顺序,被选中的那项会一直移动到底部停止。

2、假设这样一种情况:一共有10项,前三项被选中,那么我点击上移,他应该是不动的。这里怎么实现呢?首先有一个循环的变量i是固定的,然后需要在移动前判断他的前面是不是都被选中了。这时候用到了一个变量j去记录前面有几个选中的,如果i刚好等于j,那么不移动。下移功能则刚好相反。

好,已解决。

华丽的分割线-------------------------------------------------------------------------------------------------------------------------------------------------------

骚操作如下:存储已选中的项为一个数组,上下移动时先遍历此数组拿到一个值,然后遍历全部的内容拿到相等值,进行操作。(我要是知道这是谁的想法肯定把bug打回去。

这样除了上面的坑之外还有其他的坑,就是要保证两个数组都是有序的,而且排序规则需要一致。具体为什么,可以考虑极限情况。

上面两种办法都是遍历了两个数组,就是遍历的先后顺序不一样。但是从难易角度来说,我选第一种。