<template>
  <div ref="form" class="from">
    <slot />
  </div>
</template>

<script>
export default {
  props: {},
  data() {
    return {}
  },
  mounted() {
    this.resizeFrom()
    window.addEventListener('resize', this.resizeFrom)
  },
  beforeDestroy() {
    window.removeEventListener('resize', this.resizeFrom)
  },
  methods: {
    resizeFrom() {
      console.log(document.querySelector('.from').offsetWidth)
      const formItems = document.querySelectorAll('.form-item-css')
      formItems.forEach(item => {
        console.log('表单项->', item.offsetWidth)
      })
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
