ocelot-Social-Community/Ocelot-Social
1
0
Fork 0
mirror of https://github.com/Ocelot-Social-Community/Ocelot-Social.git synced 2025-12-13 07:46:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

remove computed props from grid

Browse Source
This commit is contained in:
Alina Beck 2019-08-19 10:37:20 +01:00
parent b0de4ec2b5
commit bec5ed9695
2 changed files with 5 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
webapp/components/MasonryGrid/MasonryGrid.vue
View File

@ -16,24 +16,9 @@ export default {
itemsCalculating: 0,
}
},
computed: {
rowHeight() {
if (this.$el) {
return parseInt(this.$el.style.gridAutoRows)
}
return 0
},
rowGap() {
if (this.$el) {
return parseInt(this.$el.style.gridRowGap)
}
return 0
},
},
methods: {
startCalculation() {
this.itemsCalculating += 1
return { rowHeight: this.rowHeight, rowGap: this.rowGap }
},
endCalculation() {
this.itemsCalculating -= 1

9
webapp/components/MasonryGrid/MasonryGridItem.vue
View File

@ -13,14 +13,14 @@ export default {
},
methods: {
calculateItemHeight() {
const grid = this.$parent.$emit('calculating-item-height')
this.$parent.$emit('calculating-item-height')
this.$nextTick(() => {
const grid = this.$parent
const rowHeight = parseInt(grid.$el.style.gridAutoRows)
const rowGap = parseInt(grid.$el.style.gridRowGap)
const itemHeight = this.$el.clientHeight
const rowSpan = Math.ceil((itemHeight + rowGap) / (rowHeight + rowGap))
this.rowSpan = rowSpan
this.rowSpan = Math.ceil((itemHeight + rowGap) / (rowHeight + rowGap))
this.$parent.$emit('finished-calculating-item-height')
})
},
@ -30,6 +30,7 @@ export default {
if (image) {
image.onload = () => this.calculateItemHeight()
} else {
// use timeout to make sure layout is set up before calculation
setTimeout(() => this.calculateItemHeight(), 0)
}
},