從@ui5/webcomponents-react里導(dǎo)入
List，StandardListItem和ValueState：

用下列方式繪制列表(list)：

<List><StandardListItem info="finished" infoState={ValueState.Success}>Activity 1</StandardListItem><StandardListItem info="failed" infoState={ValueState.Error}>Activity 2</StandardListItem><StandardListIteminfo="in progress"infoState={ValueState.Warning}style={{ height: "80px" }}><FlexBox direction={FlexBoxDirection.Column}><Title level={TitleLevel.H5}>Activity 3</Title><ProgressIndicatordisplayValue="89%"percentValue={89}width="180px"state={ValueState.Success}/></FlexBox></StandardListItem><StandardListIteminfo="in progress"infoState={ValueState.Warning}style={{ height: "80px" }}><FlexBox direction={FlexBoxDirection.Column}><Title level={TitleLevel.H5}>Activity 4</Title><ProgressIndicatordisplayValue="5%"percentValue={5}width="180px"state={ValueState.Error}/></FlexBox></StandardListItem> </List>

運行時效果：

要獲取更多Jerry的原創(chuàng)文章，請關(guān)注公眾號"汪子熙":

總結(jié)

以上是生活随笔為你收集整理的SAP UI5 Web Component里最简单的React列表控件的用法的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。