vue3中使用ref

<template>
    <div>
           <el-col :span="24">
                <el-form-item label="所属单位" prop="enterpriseId">
                  <el-select
                    v-model="serviceForm.enterpriseId"
                    placeholder="请选择所属单位"
                    :disabled="disabled1"
                    ref="enterpriseSel"
                    style="width: 30%;margin-right:25px;">
                    <el-option
                      v-for="option in EnterpriseList"
                      :label="option.enterpriseName"
                      :value="option.id"
                      :key="option.id"
                    />
                  </el-select>
                  <el-checkbox
                    :disabled="disabled1"
                    v-model="serviceForm.id"
                    label="是否输入"
                    @change="changeBox"
                  />
                  <el-input
                    v-model="serviceForm.enterpriseName"
                    :disabled="disabled1"
                    ref="enterpriseInput"
                    style="width:30%;margin-left:15px;"
                  />
                </el-form-item>
              </el-col>
    </div>
</template>

<script setup>

const enterpriseSel = ref(null)

function changeBox(event){

  if(event){

    nextTick(()=>{

        const select1=enterpriseSel.value;

        console.log(select1);

     })

    const selet1=this.$refs.enterpriseSel;

    //const select1=document.getElementById('enterpriseSel');

    //console.log(select1);

    select1.prop('disabled',false);

  }

  // else{

   

  //   this.$refs.enterpriseInput.css("disabled",true);

  // }

  console.log('Checkbox 的选中状态:', event);  

}

</script>