update Transfer icons

This commit is contained in:
梁灏 2018-06-26 09:43:26 +08:00
parent 99f6640559
commit a61acfdcb7
4 changed files with 38 additions and 19 deletions

View file

@ -1,16 +1,27 @@
<template>
<Transfer
:data="data1"
:target-keys="targetKeys1"
:render-format="render1"
@on-change="handleChange1"></Transfer>
:data="data3"
:target-keys="targetKeys3"
:list-style="listStyle"
:render-format="render3"
:operations="['To left','To right']"
filterable
@on-change="handleChange3">
<div :style="{float: 'right', margin: '5px'}">
<Button type="ghost" size="small" @click="reloadMockData">Refresh</Button>
</div>
</Transfer>
</template>
<script>
export default {
data () {
return {
data1: this.getMockData(),
targetKeys1: this.getTargetKeys()
data3: this.getMockData(),
targetKeys3: this.getTargetKeys(),
listStyle: {
width: '250px',
height: '300px'
}
}
},
methods: {
@ -19,8 +30,8 @@
for (let i = 1; i <= 20; i++) {
mockData.push({
key: i.toString(),
label: '内容' + i,
description: '内容' + i + '的描述信息',
label: 'Content ' + i,
description: 'The desc of content ' + i,
disabled: Math.random() * 3 < 1
});
}
@ -31,14 +42,15 @@
.filter(() => Math.random() * 2 > 1)
.map(item => item.key);
},
render1 (item) {
return item.label;
handleChange3 (newTargetKeys) {
this.targetKeys3 = newTargetKeys;
},
handleChange1 (newTargetKeys, direction, moveKeys) {
console.log(newTargetKeys);
console.log(direction);
console.log(moveKeys);
this.targetKeys1 = newTargetKeys;
render3 (item) {
return item.label + ' - ' + item.description;
},
reloadMockData () {
this.data3 = this.getMockData();
this.targetKeys3 = this.getTargetKeys();
}
}
}