【前端】项目Vue2升级Vue3注意事项

代码改动

前言

Vue2项目页面直接迁移到Vue3环境下，依旧2的写法，页面各种报错，尤其element-ui升级 element-plus 组件改动比较大；以下仅供参考：

1、图标

// 旧代码
<el-button type="primary" icon="el-icon-search" @click="handleQuery">查询</el-button>

// 新代码
<el-button type="primary" @click="handleQuery">
  <el-icon class="el-icon--left">
    <Icon icon="ep:search" />
  </el-icon>
  查询
</el-button>

2、日期

//旧代码
      <el-form-item label="上报时间" prop="createTime">
        <el-date-picker
          @change="chooseTime"
          v-model="timeRange"
          style="width: 240px"
          value-format="yyyy-MM-dd"
          :clearable="false"
          type="daterange"
          range-separator="-"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
        />
      </el-form-item>

//新代码
      <el-form-item label="上报时间" prop="createTime">
        <el-date-picker
          @change="chooseTime"
          v-model="timeRange"
          style="width: 240px"
          :clearable="false"
          type="daterange"
          range-separator="-"
          start-placeholder="开始日期"
          end-placeholder="结束日期"  
          format="YYYY-MM-DD"                                                           
          value-format="YYYY-MM-DD HH:mm:ss"                                            
          :default-time="[new Date(0, 0, 0, 0, 0, 0), new Date(0, 0, 0, 23, 59, 59)]"    
        />
      </el-form-item>


          <el-form-item label="日期：" prop="time">
            <el-date-picker
              :clearable="false"
              :editable="false"
              v-model="queryParams.time"
              value-format