【报Bug】Nvue在小米手机上执行transition-property无效

分类：uni-app

bug反馈

产品分类： uniapp/App

PC开发环境操作系统： Windows

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

HBuilderX类型：正式

HBuilderX版本号： 4.57

手机系统： Android

手机系统版本号： Android 14

手机厂商：小米

手机机型： RedMI 13C 5G

页面类型： nvue

vue版本： vue2

打包方式：云端

项目创建方式： HBuilderX

示例代码：

<template>
<view class="row">
<view class="box" :class="{'active':isActive}" @click="isActive = !isActive">
<image class="img" src="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/loveIcon.png" mode="aspectFill"></image>
</view>
</view>
</template>
<script>
export default {
data() {
return {
"isActive":false
}
}
}
</script>
<style scoped lang="scss">
.row{
align-items: center;
justify-content: center;
}
.box{
margin:20px;
align-items: center;
justify-content: center;
border-radius: 10px;
width:200rpx;
height:200rpx;
background-color: #007AFF;
transition-property: width, height, background-color;
transition-duration:1s;
transition-delay:0.1s;
transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1.0);
}
.active{
width:300rpx;
height:300rpx;
background-color: #6bd8ff;
}
.img{
width:80rpx;
height:80rpx;
}
</style>

在Nvue页面使用transition-property均为无效，但是在模拟器上又正常
代码是复制官方的
https://zh.uniapp.dcloud.io/tutorial/nvue-css.html

2025-04-24 23:25 负责人:无分享

1***@qq.com (作者) - hahaha

该问题已解决

要回复问题请先登录或注册