vue3 弹框随窗口大小实时变化

<el-form :style="{'height':dialogHei}" ref="rformRef" :model="form" :rules="rules" label- class='form" label-position="top">

   import {resize} from "@/disco/utils/util";

<el-form-item  label="Nick name" prop="warehouse">

            <el-input v-model="form.name" placeholder="\name"/>

          </el-form-item>

</el-form>

//默认弹框高度

const kangHei= ref('500px')

//弹框随窗口实时变化

const handleResize = () => {

  kangHei.value =  resize();

}

onMounted(() => {

  //监听事件

  window.addEventListener("resize", operateResize)

})

onUnmounted(() => {

  //移除监听事件

  window.removeEventListener('resize', operateResize);

})

util.ts

//弹框随窗口大小实时变化

export function  resize() {

  let innerheight:any = window.innerHeight;

  if(innerheight > 1500){

    innerheight = '82vh'//(innerheight+100)

  }else if(innerheight > 1100){

    innerheight = '81dvh'//(innerheight+100)

  }else if(innerheight > 1000){

    innerheight = '80.2dvh'//(innerheight+100)

  }else if(innerheight > 900){

    innerheight = '78.8vh'//(innerheight+50)

  }else if (innerheight > 800) {

    innerheight = '76.6vh'//(innerheight+10)  

  }else if(innerheight > 700){

    innerheight = '74.6vh'//innerheight-(innerheight * 0.282);

  }else if(innerheight >600){

    innerheight = '73vh'//innerheight-(innerheight * 0.31);

  }else{

    innerheight = '60vh'//innerheight-(innerheight * 0.41);

  }

  return innerheight;

}