fix items rendered on top of other items

This commit is contained in:
Nolan Lawson 2018-03-01 09:19:45 -08:00
parent 840f391661
commit 71d0e4ddd1
2 changed files with 23 additions and 13 deletions

View file

@ -1,5 +1,4 @@
{{#await asyncProps}} {{#if props}}
{{then props}}
<PseudoVirtualListItem :component <PseudoVirtualListItem :component
:props :props
:key :key
@ -11,15 +10,21 @@
:height :height
on:scrollToPosition on:scrollToPosition
/> />
{{/await}} {{/if}}
<script> <script>
import PseudoVirtualListItem from './PseudoVirtualListItem.html' import PseudoVirtualListItem from './PseudoVirtualListItem.html'
export default { export default {
oncreate() {
// TODO: there appears to be a bug in {{#await}} that means we have to do this manually.
// Some items may appear on top of other items because their offset is 0 and never updated.
let makeProps = this.get('makeProps')
let key = this.get('key')
if (makeProps) {
makeProps(key).then(props => this.set({props: props}))
}
},
components: { components: {
PseudoVirtualListItem PseudoVirtualListItem
},
computed: {
asyncProps: async (makeProps, key) => makeProps && makeProps(key)
} }
} }
</script> </script>

View file

@ -1,20 +1,25 @@
{{#await asyncProps}} {{#if props}}
{{then props}}
<VirtualListItem :component <VirtualListItem :component
:offset :offset
:props :props
:key :key
:index :index
/> />
{{/await}} {{/if}}
<script> <script>
import VirtualListItem from './VirtualListItem' import VirtualListItem from './VirtualListItem'
export default { export default {
oncreate() {
// TODO: there appears to be a bug in {{#await}} that means we have to do this manually.
// Some items may appear on top of other items because their offset is 0 and never updated.
let makeProps = this.get('makeProps')
let key = this.get('key')
if (makeProps) {
makeProps(key).then(props => this.set({props: props}))
}
},
components: { components: {
VirtualListItem VirtualListItem
},
computed: {
asyncProps: async (makeProps, key) => makeProps && makeProps(key)
} }
} }
</script> </script>