lg_frontend/components/FlexCenter.vue

<template>
  <div class="FlexCenter" :style="{height: cHeight}">
    <slot></slot>
  </div>
</template>

<script>
import {getSize} from "@/utils/tools";
  export default {
    name: 'FlexCenter',
    components: {},
    mixins: [],
    inject: [],
    provide() {
      return {
        FlexCol: this
      }
    },
    props: {
      height: {
        type: String,
        default: ''
      }
    },
    data() {
      return {}
    },
    computed: {
      cHeight () {
        return getSize(this.height)
      }
    },
    watch: {},
    created() {
    },
    beforeDestroy() {
    },
    mounted() {
    },
    methods: {},
  }
</script>

<style scoped lang="less">
@import "assets/styles/mixin";
  .FlexCenter {
    width: 100%;
    height: 100%;
    .flex-row;
    justify-content: center;
    align-items: center;
  }
</style>