<template>
<view>
<view v-for="item in 5" :class="[{'active':active == item}]" @click="active = item">
<text class="item_text">{{ item }}</text>
</view>
</view>
</template>
<script>
export default {
data() {
return {
active:1
}
}
}
</script>
<style scoped>
.active {
border:2rpx solid red;
}
.active .item_text{
color:red;
}
</style>
1***@qq.com
- 发布：2025-08-26 17:09
- 更新：2025-08-26 17:47
- 阅读：24
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： win10
HBuilderX类型： 正式
HBuilderX版本号： 4.76
手机系统： Android
手机系统版本号： Android 15
手机厂商： 小米
手机机型： 小米15
页面类型： nvue
vue版本： vue2
打包方式： 离线
项目创建方式： HBuilderX
示例代码：
操作步骤：
无
无
预期结果：
动态样式设置子元素生效
动态样式设置子元素生效
实际结果：
动态样式设置子元素不生效
动态样式设置子元素不生效
bug描述：
vue2项目，现在改vue3，切换后，在app上发现动态类名的子元素的样式是不生效的，详细查看代码实例,想要通过.active .item_text,这样动态修改item_text样式是失效的，如下图所示，正常字体跟着边框都是红色的。
1***@qq.com (作者)
害，自己写的组件还好，问题是他那个uni-ui里面也是这样样式，很多是失效的，怎么改？
2025-08-26 17:52