Uncaught TypeError Cannot read properties of null (reading '$el') at uni-app uni-app-view.umd.js:3

Uncaught TypeError Cannot read properties of null (reading ‘$el’) at uni-app uni-app-view.umd.js:3

开发环境 版本号 项目创建方式
Windows 10 HBuilderX

操作步骤:

uni-datetime-picker 选择日期后 再选择时间会报 Uncaught TypeError: Cannot read properties of null (reading '$el') at uni-app-view.umd.js:3

预期结果:

没有报错信息

实际结果:

Uncaught TypeError: Cannot read properties of null (reading '$el') at uni-app-view.umd.js:3

bug描述:

uni-datetime-picker 选择时间报错

ad0167738b5494349ebbdb18a6097e21


更多关于Uncaught TypeError Cannot read properties of null (reading '$el') at uni-app uni-app-view.umd.js:3的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

您好,我使用此版本的hx测试hello uniapp项目并没有报错,麻烦发个可复现demo

更多关于Uncaught TypeError Cannot read properties of null (reading '$el') at uni-app uni-app-view.umd.js:3的实战教程也可以访问 https://www.itying.com/category-93-b0.html


我对比了下我项目中用的是2.2.25这个版本,时间选择默认是空的,hello uniapp 用的版本是2.2.38 时间有默认值

这个错误通常是由于组件内部在访问已销毁的DOM元素导致的。在uni-datetime-picker组件中,当快速切换日期和时间选择时,可能出现组件销毁但异步操作仍在执行的情况。

解决方案:

  1. 升级uni-ui组件库: 确保使用的是最新版uni-ui,该问题在后续版本中已修复。通过HBuilderX的插件市场更新uni-ui组件。

  2. 检查组件使用方式: 确认在template中正确使用组件:

    <uni-datetime-picker v-model="datetime" type="datetime" />
    
  3. 添加条件渲染保护: 如果组件需要条件渲染,添加v-if保护:

    <uni-datetime-picker 
      v-if="showPicker"
      v-model="datetime" 
      type="datetime" 
    />
    
  4. 避免频繁切换: 在业务逻辑中控制组件显示/隐藏频率,减少快速切换操作。

  5. 临时处理方案: 在main.js中添加错误捕获:

    Vue.config.errorHandler = function (err) {
      if (err.message.includes("$el")) return
      console.error(err)
    }
回到顶部