代码如下:
<div className='notice-content__box'>
<div className='notice-content__item'>
{
extensionMap?.length > 0 && extensionMap.map((el: any, index: number) => {
return <div className={cls('item label', { 'no-name-item': !showSubject })} key={index}>{el.key}</div>
})
}
</div>
<div className='notice-content__item item-value'>
{
extensionMap?.length > 0 && extensionMap.map((el: any, index: number) => {
return <div className={cls('item', { 'no-name-item': !showSubject })} key={index}>{el.value}</div>
})
}
</div >
</div >
.notice-content__box {
width: 100%;
display: flex;
align-items: center;
.notice-content__item {
.item {
height: 20px !important;
line-height: 20px;
font-size: 14px;
font-weight: normal;
letter-spacing: 0;
color: #191919;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.label {
color: #999 !important;
}
.item + .item {
margin-top: 6px;
}
.no-name-item + .no-name-item {
margin-top: 8px !important;
}
}
.item-value {
overflow: hidden;
}
.notice-content__item + .notice-content__item {
margin-left: 22px;
}
}
}