let not selectable-list know about getKey prop

This commit is contained in:
taehoon 2019-04-04 00:22:55 -04:00
parent 32035217b8
commit b8ec13c8fd
3 changed files with 7 additions and 8 deletions

View file

@ -1,7 +1,7 @@
<template>
<div class="list">
<div v-for="item in items" class="list-item" :key="getKey(item)">
<slot name="item" :item="item" />
<slot name="item" :item="item" :keyVal="getKey(item)" />
</div>
<div class="list-empty-content faint" v-if="items.length === 0">
<slot name="empty" />

View file

@ -13,10 +13,9 @@ const SelectableList = {
}
},
methods: {
toggle (checked, item) {
const oldChecked = this.isSelected(item)
toggle (checked, key) {
const oldChecked = this.isSelected(key)
if (checked !== oldChecked) {
const key = this.getKey(item)
if (checked) {
this.selected.push(key)
} else {
@ -24,8 +23,8 @@ const SelectableList = {
}
}
},
isSelected (item) {
return this.selected.indexOf(this.getKey(item)) !== -1
isSelected (key) {
return this.selected.indexOf(key) !== -1
}
}
}

View file

@ -1,9 +1,9 @@
<template>
<List class="selectable-list" :items="items" :getKey="getKey">
<template slot="item" scope="p">
<div class="selectable-list-item-inner" :class="{ 'selectable-list-item-selected-inner': isSelected(p.item) }">
<div class="selectable-list-item-inner" :class="{ 'selectable-list-item-selected-inner': isSelected(p.keyVal) }">
<div class="selectable-list-checkbox-wrapper">
<Checkbox :checked="isSelected(p.item)" @change="checked => toggle(checked, p.item)" />
<Checkbox :checked="isSelected(p.keyVal)" @change="checked => toggle(checked, p.keyVal)" />
</div>
<slot name="item" :item="p.item" />
</div>