Merge pull request #599 from BigLiao/bugfix/transfer-target-sort

fix(transfer): 修复targetSort展示问题

Author: PengYYYYY

src/transfer/utils.ts

@@ -164,9 +164,14 @@ function filterTransferData(
   isTreeMode = false,
 ) {
   if (!isTreeMode) {
+    if (needMatch) {
+      // 正向过滤。要保持filterValues顺序
+      return filterValues.map((value) => data.find((item) => item.value === value));
+    }
+    // 反向过滤
     return data.filter((item) => {
       const isMatch = filterValues.includes(item.value);
-      return needMatch ? isMatch : !isMatch;
+      return !isMatch;
     });
   }
 

test/unit/transfer/index.test.js

@@ -315,6 +315,13 @@ describe('Transfer', () => {
 
         wrapper.vm.$el.querySelectorAll('.t-transfer__operations button')[0].click();
         expect(wrapper.vm.$data.targetValue).toEqual(['1', '2', '5']);
+
+        await wrapper.vm.$nextTick();
+        const targetColumn = wrapper.vm.$el.querySelectorAll(
+          '.t-transfer__list-target .t-transfer__list-item input[type=checkbox]',
+        );
+        const targetColumnValues = Array.prototype.map.call(targetColumn, (item) => item.value);
+        expect(targetColumnValues).toEqual(['1', '2', '5']);
       });
 
       it('push', async () => {
@@ -336,6 +343,13 @@ describe('Transfer', () => {
 
         wrapper.vm.$el.querySelectorAll('.t-transfer__operations button')[0].click();
         expect(wrapper.vm.$data.targetValue).toEqual(['1', '5', '2']);
+
+        await wrapper.vm.$nextTick();
+        const targetColumn = wrapper.vm.$el.querySelectorAll(
+          '.t-transfer__list-target .t-transfer__list-item input[type=checkbox]',
+        );
+        const targetColumnValues = Array.prototype.map.call(targetColumn, (item) => item.value);
+        expect(targetColumnValues).toEqual(['1', '5', '2']);
       });
 
       it('unshift', async () => {
@@ -357,6 +371,13 @@ describe('Transfer', () => {
 
         wrapper.vm.$el.querySelectorAll('.t-transfer__operations button')[0].click();
         expect(wrapper.vm.$data.targetValue).toEqual(['2', '1', '5']);
+
+        await wrapper.vm.$nextTick();
+        const targetColumn = wrapper.vm.$el.querySelectorAll(
+          '.t-transfer__list-target .t-transfer__list-item input[type=checkbox]',
+        );
+        const targetColumnValues = Array.prototype.map.call(targetColumn, (item) => item.value);
+        expect(targetColumnValues).toEqual(['2', '1', '5']);
       });
     });