list-item 根据boolean属性 动态设置class
list-item 根据boolean属性 动态设置class
鸿蒙
HarmonyOS
OpenHarmony
赞
收藏 0
回答 1
待解决
相关问题
点击一个list的item，怎么给这个item添加class
4032浏览 • 1回复 待解决
如何让list-item组件里的image图片懒加载？
129浏览 • 1回复 待解决
JS swiper 怎么像list一样动态添加item？
4151浏览 • 1回复 待解决
求js 中 class类名动态绑定的问题？
4401浏览 • 1回复 待解决
如何动态根据资源名获取资源id
6059浏览 • 1回复 已解决
轻量级js ui，如何获取到list滚动到的item的index？
2260浏览 • 1回复 待解决
动态设置文本导致致命错误
4987浏览 • 1回复 待解决
JavaUI 中List组件怎么实现右键点击Item项关联弹出一个菜单?
1256浏览 • 1回复 待解决
list组件，当设置点击事件时，如何知道当前点击的list索引号
4892浏览 • 1回复 待解决
组件如何动态设置全局唯一ID？
4646浏览 • 1回复 待解决
js如何把list组件设置为横向的？
1545浏览 • 1回复 待解决
SideBarContainer，想设置按钮的位置，controlButton属性不会设置，能给个例子吗？
618浏览 • 1回复 待解决
请教一下listcontainer怎么设置item的左右滑动事件？
4013浏览 • 1回复 待解决
SystemPluginLoader: find plugin class exception, Class:ohos.event.notification.plugin.NotificationPl
3611浏览 • 1回复 待解决
鸿蒙的服务卡片点击事件传参,可以动态设置吗?
4244浏览 • 1回复 待解决
请教一下，listcontainer怎么设置item的滑动事件？是哪个方法？
3354浏览 • 1回复 待解决
Button如何设置state-container背景，目前button只能设置默认背景，无法显示点击动态效果？
4347浏览 • 1回复 待解决
配置文件如何根据安装设备设置显示分辨率？
279浏览 • 1回复 待解决
EventRunner 创建新线程的时候 create(boolean isDeposited)...？
4826浏览 • 1回复 待解决
关于属性动画的问题？
7933浏览 • 3回复 待解决
hdc list targets 返回 empty
1200浏览 • 1回复 待解决
ListContainer中的Item能取消拖拽吗
3137浏览 • 1回复 待解决
如何根据uri读取文件?
532浏览 • 1回复 待解决
请问如何禁用ListContainer中item的拖动功能
5688浏览 • 1回复 待解决
textfield的截断属性不生效
592浏览 • 1回复 待解决
通过三目运算符就可以了。
附上代码供参考：
<!-- index.hml -->
<div class="container">
<list class="todo-wrapper">
<list-item for="{{ todolist }}" class="{{ booleanValue ? 'redClass' : 'blueClass' }}">
<text class="todo-title">{{ $item.title }}</text>
<text class="todo-title">{{ $item.date }}</text>
</list-item>
</list>
</div>
// index.js
export default {
data: {
todolist: [{
title: '刷题',
date: '2021-12-31 10:00:00',
}, {
title: '看电影',
date: '2021-12-31 20:00:00',
}],
booleanValue: false
},
}
/* index.css */
.container {
display: flex;
justify-content: center;
align-items: center;
left: 0px;
top: 0px;
width: 454px;
height: 454px;
}
.todo-wrapper {
width: 454px;
height: 300px;
}
.todo-item {
width: 454px;
height: 80px;
flex-direction: column;
}
.todo-title {
width: 454px;
height: 40px;
text-align: center;
}
.redClass {
background-color: red;
}
.blueClass {
background-color: blue;
}