Commit 84a8a413aa0f14873b4923c703242625441e94dd

Authored by 梁灏
1 parent 7c2ed52c

fixed bug of Transfer when no slot

fixed bug of Transfer when no slot
examples/routers/form.vue
... ... @@ -11,7 +11,7 @@
11 11 <Form-item prop="user">
12 12 <Input v-model="formInline.user"></Input>
13 13 </Form-item>
14   - <Form-item>
  14 + <Form-item prop="targetKeys1">
15 15 <Transfer
16 16 :data="formInline.data1"
17 17 :target-keys="formInline.targetKeys1"
... ...
examples/routers/transfer.vue
1   -<!--<template>-->
2   - <!--<div>-->
3   - <!--<Transfer-->
4   - <!--:data="data1"-->
5   - <!--filterable-->
6   - <!--:target-keys="targetKeys1"-->
7   - <!--:render-format="render1"-->
8   - <!--@on-change="handleChange1"></Transfer>-->
9   - <!--</div>-->
10   -<!--</template>-->
11   -<!--<script>-->
12   - <!--export default {-->
13   - <!--data () {-->
14   - <!--return {-->
15   - <!--data1: this.getMockData(),-->
16   - <!--targetKeys1: this.getTargetKeys()-->
17   - <!--}-->
18   - <!--},-->
19   - <!--methods: {-->
20   - <!--getMockData () {-->
21   - <!--let mockData = [];-->
22   - <!--for (let i = 1; i <= 20; i++) {-->
23   - <!--mockData.push({-->
24   - <!--key: i.toString(),-->
25   - <!--label: '内容' + i,-->
26   - <!--description: '内容' + i + '的描述信息',-->
27   - <!--disabled: Math.random() * 3 < 1-->
28   - <!--});-->
29   - <!--}-->
30   - <!--return mockData;-->
31   - <!--},-->
32   - <!--getTargetKeys () {-->
33   - <!--return this.getMockData()-->
34   - <!--.filter(() => Math.random() * 2 > 1)-->
35   - <!--.map(item => item.key);-->
36   - <!--},-->
37   - <!--render1 (item) {-->
38   - <!--return item.label;-->
39   - <!--},-->
40   - <!--handleChange1 (newTargetKeys, direction, moveKeys) {-->
41   - <!--console.log(newTargetKeys);-->
42   - <!--console.log(direction);-->
43   - <!--console.log(moveKeys);-->
44   - <!--this.targetKeys1 = newTargetKeys;-->
45   - <!--}-->
46   - <!--}-->
47   - <!--}-->
48   -<!--</script>-->
49   -
50   -
51 1 <template>
52   - <Transfer
53   - :data="data3"
54   - :target-keys="targetKeys3"
55   - :list-style="listStyle"
56   - :render-format="render3"
57   - :operations="['向左移动','向右移动']"
58   - filterable
59   - @on-change="handleChange3">
60   - <div :style="{float: 'right', margin: '5px'}">
61   - <Button type="ghost" size="small" @click.native="reloadMockData">刷新</Button>
62   - </div>
63   - </Transfer>
  2 + <div>
  3 + <Transfer
  4 + :data="data1"
  5 + filterable
  6 + :target-keys="targetKeys1"
  7 + :render-format="render1"
  8 + @on-change="handleChange1"></Transfer>
  9 + </div>
64 10 </template>
65 11 <script>
66 12 export default {
67 13 data () {
68 14 return {
69   - data3: this.getMockData(),
70   - targetKeys3: this.getTargetKeys(),
71   - listStyle: {
72   - width: '250px',
73   - height: '300px'
74   - }
  15 + data1: this.getMockData(),
  16 + targetKeys1: this.getTargetKeys()
75 17 }
76 18 },
77 19 methods: {
... ... @@ -92,20 +34,78 @@
92 34 .filter(() => Math.random() * 2 > 1)
93 35 .map(item => item.key);
94 36 },
95   - handleChange3 (newTargetKeys) {
96   - this.targetKeys3 = newTargetKeys;
  37 + render1 (item) {
  38 + return item.label;
97 39 },
98   - render3 (item) {
99   - return item.label + ' - ' + item.description;
100   - },
101   - reloadMockData () {
102   - this.data3 = this.getMockData();
103   - this.targetKeys3 = this.getTargetKeys();
  40 + handleChange1 (newTargetKeys, direction, moveKeys) {
  41 + console.log(newTargetKeys);
  42 + console.log(direction);
  43 + console.log(moveKeys);
  44 + this.targetKeys1 = newTargetKeys;
104 45 }
105 46 }
106 47 }
107 48 </script>
108 49  
  50 +
  51 +<!--<template>-->
  52 + <!--<Transfer-->
  53 + <!--:data="data3"-->
  54 + <!--:target-keys="targetKeys3"-->
  55 + <!--:list-style="listStyle"-->
  56 + <!--:render-format="render3"-->
  57 + <!--:operations="['向左移动','向右移动']"-->
  58 + <!--filterable-->
  59 + <!--@on-change="handleChange3">-->
  60 + <!--<div :style="{float: 'right', margin: '5px'}">-->
  61 + <!--<Button type="ghost" size="small" @click.native="reloadMockData">刷新</Button>-->
  62 + <!--</div>-->
  63 + <!--</Transfer>-->
  64 +<!--</template>-->
  65 +<!--<script>-->
  66 + <!--export default {-->
  67 + <!--data () {-->
  68 + <!--return {-->
  69 + <!--data3: this.getMockData(),-->
  70 + <!--targetKeys3: this.getTargetKeys(),-->
  71 + <!--listStyle: {-->
  72 + <!--width: '250px',-->
  73 + <!--height: '300px'-->
  74 + <!--}-->
  75 + <!--}-->
  76 + <!--},-->
  77 + <!--methods: {-->
  78 + <!--getMockData () {-->
  79 + <!--let mockData = [];-->
  80 + <!--for (let i = 1; i <= 20; i++) {-->
  81 + <!--mockData.push({-->
  82 + <!--key: i.toString(),-->
  83 + <!--label: '内容' + i,-->
  84 + <!--description: '内容' + i + '的描述信息',-->
  85 + <!--disabled: Math.random() * 3 < 1-->
  86 + <!--});-->
  87 + <!--}-->
  88 + <!--return mockData;-->
  89 + <!--},-->
  90 + <!--getTargetKeys () {-->
  91 + <!--return this.getMockData()-->
  92 + <!--.filter(() => Math.random() * 2 > 1)-->
  93 + <!--.map(item => item.key);-->
  94 + <!--},-->
  95 + <!--handleChange3 (newTargetKeys) {-->
  96 + <!--this.targetKeys3 = newTargetKeys;-->
  97 + <!--},-->
  98 + <!--render3 (item) {-->
  99 + <!--return item.label + ' - ' + item.description;-->
  100 + <!--},-->
  101 + <!--reloadMockData () {-->
  102 + <!--this.data3 = this.getMockData();-->
  103 + <!--this.targetKeys3 = this.getTargetKeys();-->
  104 + <!--}-->
  105 + <!--}-->
  106 + <!--}-->
  107 +<!--</script>-->
  108 +
109 109 <!--<template>-->
110 110 <!--<Transfer-->
111 111 <!--:data="data4"-->
... ...
src/components/transfer/transfer.vue
... ... @@ -67,8 +67,8 @@
67 67 return cloned;
68 68 }
69 69  
70   - const vNodes = this.$slots.default;
71   - const clonedVNodes = vNodes.map(vnode => cloneVNode(vnode));
  70 + const vNodes = this.$slots.default === undefined ? [] : this.$slots.default;
  71 + const clonedVNodes = this.$slots.default === undefined ? [] : vNodes.map(vnode => cloneVNode(vnode));
72 72  
73 73 return createElement('div', {
74 74 'class': this.classes
... ...