<share-element class="wh120" key="avatar" :transform="transformIdx == index"><image></image></share-element>
1***@qq.com
- 发布：2021-06-13 23:21
- 更新：2022-07-18 17:32
- 阅读：827
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： win10
HBuilderX类型： Alpha
HBuilderX版本号： 3.1.17
手机系统： Android
手机系统版本号： Android 10
手机厂商： 华为
手机机型： p30
页面类型： vue
打包方式： 离线
项目创建方式： HBuilderX
示例代码：
操作步骤：
<share-element class="wh120" key="avatar" :transform="transformIdx == index"><image></image></share-element>
<share-element class="wh120" key="avatar" :transform="transformIdx == index"><image></image></share-element>
预期结果：
<share-element class="wh120" key="avatar" :transform="transformIdx == index"><image></image></share-element>
<share-element class="wh120" key="avatar" :transform="transformIdx == index"><image></image></share-element>
实际结果：
<share-element class="wh120" transform="transformIdx == index"><image></image></share-element>
<share-element class="wh120" transform="transformIdx == index"><image></image></share-element>
bug描述：
uniapp编译到微信小程序时会过滤模板:key，
比如： <share-element class="wh120" key="avatar" :transform="transformIdx == index"><image></image></share-element>
编译到微信小程序后 ，key="avatar" 消失了。
微信小程序很多组件依靠 key 来同步操作，key 被过滤后，组件都出问题了
1***@qq.com (作者)
比如很多微信小程序的组件依靠 key ，比如共享元素组件：
<share-element class="name" key="title" :transform="transformIdx == index">
<view class="ft16">{{ title }}</view>
</share-element>以上使用uniapp 编译到微信小程序 key="title" 消失了
1***@qq.com (作者)
不是 在
<view v-for="(tab, index) in tabBars" :key="index" 以上位于 v-for 操作的 的 :key 值会被正常的编译，
但是，当在模板中使用 单纯的 key="xxxx" 或者 :key="xxx" 时，编译后， key="xxxx" 就消失了。如：
<share-element class="name" key="title" :transform="transformIdx == index"> 这个时候 ，编译后 key=“xxx” 就消失了
1***@qq.com (作者)
谢谢
2021-06-19 21:33
曾小晨
一年了
2022-07-11 15:24