uni-app打包H5后服务器运行报错

uni-app打包H5后服务器运行报错

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

操作步骤：

this.dh12_Show2 = true

预期结果：

<view class="ddzp-box2 active">

实际结果：

<view class="ddzp-box2">

bug描述：

本地打包运行都完全正常，console也没有报错，打包h5后放到服务器上点击运行就报错，报错逐步排查是由于给class赋值导致的 :class="{active:dh12_Show2}"


更多关于uni-app打包H5后服务器运行报错的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

线上其他使用动态class的地方有报错吗？

更多关于uni-app打包H5后服务器运行报错的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这个问题的根本原因是H5打包后的运行环境与本地开发环境存在差异，导致class绑定失效。以下是具体分析和解决方案：

  1. 问题分析：
  • 在H5打包后，Vue的运行时编译器被移除，只保留运行时版本
  • 动态class绑定语法:class="{active:dh12_Show2}"在严格模式下需要确保dh12_Show2已定义
  1. 解决方案： (1) 确保dh12_Show2在data中正确定义：
data() {
  return {
    dh12_Show2: false // 确保有初始值
  }
}

(2) 或者改用数组语法更可靠：

<view :class="['ddzp-box2', dh12_Show2 ? 'active' : '']">
回到顶部