SAP UI5 Web Component里最简单的React列表控件的用法
2023-09-14 09:02:40 时间
从@ui5/webcomponents-react里导入
List,StandardListItem和ValueState:
用下列方式绘制列表(list):
<List>
<StandardListItem info="finished" infoState={ValueState.Success}>
Activity 1
</StandardListItem>
<StandardListItem info="failed" infoState={ValueState.Error}>
Activity 2
</StandardListItem>
<StandardListItem
info="in progress"
infoState={ValueState.Warning}
style={{ height: "80px" }}>
<FlexBox direction={FlexBoxDirection.Column}>
<Title level={TitleLevel.H5}>Activity 3</Title>
<ProgressIndicator
displayValue="89%"
percentValue={89}
width="180px"
state={ValueState.Success}/>
</FlexBox>
</StandardListItem>
<StandardListItem
info="in progress"
infoState={ValueState.Warning}
style={{ height: "80px" }}>
<FlexBox direction={FlexBoxDirection.Column}>
<Title level={TitleLevel.H5}>Activity 4</Title>
<ProgressIndicator
displayValue="5%"
percentValue={5}
width="180px"
state={ValueState.Error}/>
</FlexBox>
</StandardListItem>
</List>
运行时效果:
要获取更多Jerry的原创文章,请关注公众号"汪子熙":
相关文章
- SAP UI5 sap.ui.layout.Grid 控件宽度百分比的设置原理
- SAP UI5 应用中 MockServer 的实例化方法
- 关于 SAP UI5 所有控件的共同祖先 - sap.ui.base.ManagedObject
- SAP UI5 sap.ui.base.ManagedObject 的构造函数参数讲解
- SAP 电商云 CMSUserGroupRestriction 在 Spartacus 里的 evaluation 问题
- SAP Hybris Category 显示在 Storefront 的判定条件
- SAP UI5 sap.ui.Device.media.RANGESETS.SAP_STANDARD_EXTENDED 介绍
- SAP Move to Rise是什么意思? SAP Move的五条路径是什么?
- 安装SAP,Linux获台前瞻未来(linux安装sap)
- Oracle购买SAP: 开启新数据时代(oracle收购sap)
- SAP 《MM学习指南》操作记录—- 计划协议及交货计划详解编程语言
- sap的字段和对象修改记录的查找详解编程语言
- SAP GUI FOR HTML登陆详解编程语言
- SAP PI 配置soap web service详解编程语言
- Oracle从SAP抽取数据的简单方法(oracle从sap抽数)
- 数据库解决方案如何使用SAP创建Redis数据库(sap怎么创建redis)
- 跨界合作新模式 Oracle与SAP实现合并(oracle与sap合并)
- 对比Oracle和SAP价格比较哪个是更值得投入的选择(oracle与sap价格)
- 聘请高级Oracle与SAP顾问,拓展业务潜力(oracle sap顾问)
- 使用Oracle与SAP进行数据接口开发(oracle sap接口)
- 探索 Oracle 与 SAP 技术的开发可能性(oracle sap开发)