<Row>
    <Col style={{ marginBottom: '30px' }} >
         <a className="labelstyle" style={{ padding: fundType.length < 1 ? '0px' : '5px', marginRight: fundType.length < 1 ? '0px' : '10px' }}  >{fundType}</a>
         <a className="labelstyle" style={{ padding: orderSellerType.length < 1 ? '0px' : '5px', marginRight: orderSellerType.length < 1 ? '0px' : '10px' }}  >{orderSellerType}</a>
    </Col>
</Row> 
使用<a>组件的背景:
想给业务流量加标签,使用动态样式后最终实现如下:

如果不使用动态样式时:
<Row>
    <Col style={{ marginBottom: '30px' }} >
         <a className="labelstyle">{fundType}</a>
         <a className="labelstyle">{orderSellerType}</a>
    </Col>
</Row> 
:global {
    .labelstyle{
      color: white;
      background-color: #1890ff;
      margin-bottom: 30px;
      border-radius:10%;
      -webkit-border-radius: 4px;
      -moz-border-radius: 4px;
      border-radius: 4px;
    }
} 
当<a>组件展示的变量为null或者空时,页面样式如下:



















