This commit is contained in:
梁灏 2017-04-01 11:21:35 +08:00
parent 48af13599c
commit 8fbc8c7191
2 changed files with 127 additions and 48 deletions

View file

@ -1,51 +1,51 @@
<template> <!--<template>-->
<div> <!--<div>-->
<Transfer <!--<Transfer-->
:data="data1" <!--:data="data1"-->
filterable <!--filterable-->
:target-keys="targetKeys1" <!--:target-keys="targetKeys1"-->
:render-format="render1" <!--:render-format="render1"-->
@on-change="handleChange1"></Transfer> <!--@on-change="handleChange1"></Transfer>-->
</div> <!--</div>-->
</template> <!--</template>-->
<script> <!--<script>-->
export default { <!--export default {-->
data () { <!--data () {-->
return { <!--return {-->
data1: this.getMockData(), <!--data1: this.getMockData(),-->
targetKeys1: this.getTargetKeys() <!--targetKeys1: this.getTargetKeys()-->
} <!--}-->
}, <!--},-->
methods: { <!--methods: {-->
getMockData () { <!--getMockData () {-->
let mockData = []; <!--let mockData = [];-->
for (let i = 1; i <= 20; i++) { <!--for (let i = 1; i <= 20; i++) {-->
mockData.push({ <!--mockData.push({-->
key: i.toString(), <!--key: i.toString(),-->
label: '内容' + i, <!--label: '内容' + i,-->
description: '内容' + i + '的描述信息', <!--description: '内容' + i + '的描述信息',-->
disabled: Math.random() * 3 < 1 <!--disabled: Math.random() * 3 < 1-->
}); <!--});-->
} <!--}-->
return mockData; <!--return mockData;-->
}, <!--},-->
getTargetKeys () { <!--getTargetKeys () {-->
return this.getMockData() <!--return this.getMockData()-->
.filter(() => Math.random() * 2 > 1) <!--.filter(() => Math.random() * 2 > 1)-->
.map(item => item.key); <!--.map(item => item.key);-->
}, <!--},-->
render1 (item) { <!--render1 (item) {-->
return item.label; <!--return item.label;-->
}, <!--},-->
handleChange1 (newTargetKeys, direction, moveKeys) { <!--handleChange1 (newTargetKeys, direction, moveKeys) {-->
console.log(newTargetKeys); <!--console.log(newTargetKeys);-->
console.log(direction); <!--console.log(direction);-->
console.log(moveKeys); <!--console.log(moveKeys);-->
this.targetKeys1 = newTargetKeys; <!--this.targetKeys1 = newTargetKeys;-->
} <!--}-->
} <!--}-->
} <!--}-->
</script> <!--</script>-->
<!--<template>--> <!--<template>-->
@ -148,3 +148,79 @@
<!--}--> <!--}-->
<!--}--> <!--}-->
<!--</script>--> <!--</script>-->
<template>
<div>
<Transfer
:data="data1"
filterable
:target-keys="targetKeys1"
:render-format="render1"
@on-change="handleChange1"></Transfer>
</div>
</template>
<script>
export default {
data () {
return {
data1: this.getMockData(),
targetKeys1: this.getTargetKeys()
}
},
created(){
console.log('--created--');
this.fetch();
},
methods: {
fetch() {
const _this = this;
setTimeout(function() {
console.log('--1');
// _this.data1 = null;
_this.data1 = _this.getMockData1();
console.log('-fetch-', _this.data1);
}, 1500);
},
getMockData () {
let mockData = [];
for (let i = 1; i <= 20; i++) {
mockData.push({
key: i.toString(),
label: '内容' + i,
description: '内容' + i + '的描述信息',
disabled: Math.random() * 3 < 1
});
}
return mockData;
},
getMockData1 () {
let mockData = [];
for (let i = 1; i <= 20; i++) {
mockData.push({
key: i.toString(),
label: '内容11111' + i,
description: '内容11111 ' + i + ' 1111的描述信息',
// disabled: Math.random() * 3 < 1
});
}
return mockData;
},
getTargetKeys () {
return this.getMockData()
.filter(() => Math.random() * 2 > 1)
.map(item => item.key);
},
render1 (item) {
return item.label;
},
handleChange1 (newTargetKeys, direction, moveKeys) {
console.log(newTargetKeys);
console.log(direction);
console.log(moveKeys);
this.targetKeys1 = newTargetKeys;
}
}
}
</script>

View file

@ -244,6 +244,9 @@
watch: { watch: {
targetKeys () { targetKeys () {
this.splitData(false); this.splitData(false);
},
data () {
this.splitData(false);
} }
}, },
created () { created () {