diff --git a/src/client/components/date-separated-list.vue b/src/client/components/date-separated-list.vue index 6a0c7f29f..7a4cc5ef9 100644 --- a/src/client/components/date-separated-list.vue +++ b/src/client/components/date-separated-list.vue @@ -48,15 +48,7 @@ export default defineComponent({ render() { if (this.items.length === 0) return; - return h(this.$store.state.animation ? TransitionGroup : 'div', this.$store.state.animation ? { - class: 'sqadhkmv' + (this.noGap ? ' noGap _block' : ''), - name: 'list', - tag: 'div', - 'data-direction': this.direction, - 'data-reversed': this.reversed ? 'true' : 'false', - } : { - class: 'sqadhkmv' + (this.noGap ? ' noGap _block' : ''), - }, this.items.map((item, i) => { + const renderChildren = () => this.items.map((item, i) => { const el = this.$slots.default({ item: item })[0]; @@ -98,7 +90,19 @@ export default defineComponent({ return el; } } - })); + }); + + return h(this.$store.state.animation ? TransitionGroup : 'div', this.$store.state.animation ? { + class: 'sqadhkmv' + (this.noGap ? ' noGap _block' : ''), + name: 'list', + tag: 'div', + 'data-direction': this.direction, + 'data-reversed': this.reversed ? 'true' : 'false', + } : { + class: 'sqadhkmv' + (this.noGap ? ' noGap _block' : ''), + }, { + default: renderChildren + }); }, });