Hbuilderx创建的VUE3项目在uni-app打包编译后自定义的属性都聚合了使用原生组件时候就会参数丢失无法使用

Hbuilderx创建的VUE3项目在uni-app打包编译后自定义的属性都聚合了使用原生组件时候就会参数丢失无法使用

产品分类：
uniapp/小程序/微信

PC开发环境操作系统：
Windows

PC开发环境操作系统版本号：
win11

HBuilderX类型：
正式

HBuilderX版本号：
4.66

第三方开发者工具版本号：
0.0.0.0

基础库版本号：
0.0.0.0

项目创建方式：
HBuilderX

示例代码：

<mapss-component  
        class="c111"  
        id="mpass"  
        style="width: 100px"  
        data-type="type"  
        type1="type1"  
        latitude="120"  
        langtitude="130"  
      >
</mapss-component>

操作步骤：

Hbuilderx创建的VUE3项目，在打包编译后自定义的属性都聚合了，使用原生组件时候就会参数丢失无法使用

预期结果：

能增加配置，遇到匹配的标签元素不聚合

实际结果：

打包后，属性聚合，无法获取属性参数

<mpaas-component
class="c111"
id="mpass"
style="width: 100px"
data-type="type"
u-i="01a60e8c-2"
onVI="__l"
u-p="{{ g || '' }}"
>
</mpaas-component>

bug描述：

Hbuilderx创建的VUE3项目，在打包编译后自定义的属性都聚合了，使用原生组件时候就会参数丢失无法使用

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

更多关于Hbuilderx创建的VUE3项目在uni-app打包编译后自定义的属性都聚合了使用原生组件时候就会参数丢失无法使用的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

感谢反馈，问题已复现，已加分
临时解决方案
替换 /Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli-vite/node_modules/@dcloudio/uni-mp-alipay/dist/uni.compiler.js 为附件文件

更多关于Hbuilderx创建的VUE3项目在uni-app打包编译后自定义的属性都聚合了使用原生组件时候就会参数丢失无法使用的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这是一个在uni-app中使用原生组件时常见的属性传递问题。在Vue3项目中，当组件名包含短横线时，编译器会对属性进行特殊处理。

解决方案：

  1. 对于原生组件，建议使用data-前缀来传递自定义属性：
<mapss-component
  data-type="type"
  data-type1="type1"
  data-latitude="120"
  data-langtitude="130"
></mapss-component>
  1. 在组件内部通过dataset获取：
const type = this.dataset.type;
const type1 = this.dataset.type1;
  1. 如果必须使用原生属性名，可以在manifest.json中配置：
"mp-weixin": {
  "optimization": {
    "subPackages": true,
    "attributeMinification": false
  }
}
  1. 另一种方案是使用v-bind绑定对象：
<mapss-component v-bind="customProps"></mapss-component>
回到顶部