<template>
    <div
        :ref="cellId"
    >
    </div>
</template>

<script>
export default {
    data: function() {
        return {
            cellId: '_' + Math.random().toString(36).substr(2, 9)
        };
    },
    methods: {
        updateCellHeight: function() {
            this.$refs[this.cellId].clientHeight = this.$refs[this.cellId].clientWidth;
        }
    },
    created: function() {
        window.addEventListener("resize", this.updateCellHeight);
        this.updateCellHeight();
    },
    destroyed: function() {
        window.removeEventListener("resize", this.updateCellHeight);
    }
}
</script>