【React工作记录六十六】ant design Row col样式修改

目录

前言

导语

运行结果

前言

我是歌谣 我有个兄弟 巅峰的时候排名c站总榜19 叫前端小歌谣 曾经我花了三年的时间创作了他 现在我要用五年的时间超越他 今天又是接近兄弟的一天人生难免坎坷 大不了从头再来 歌谣的意志是永恒的 放弃很容易 但是坚持一定很酷

导语

ant design Row col样式修改

编辑

<Card>
          <Row gutter={24}>
            <Col span={3}>
              <DefaultImg
                src={activeUpdateData.imgLogo}
                type="headImg"
                style={{ width: 150, height: 150, borderRadius: '50%', marginRight: 10 }}
              />
            </Col>
            <Col span={21} style={{ color: '#333333', fontSize: 16 }}>
              <Row>
                <span
                  style={{
                    fontSize: 26,
                  }}
                >
                  供应商名称： {activeUpdateData.name}
                </span>
                <span>
                  <a onclick={() => this.copyTitle(activeUpdateData.name)}>复制</a>
                </span>
              </Row>
              <Row style={{ marginTop: 20 }}>
                <Col span={6}>
                  <span>申请人：{activeUpdateData.createByName}</span>
                </Col>
                <Col span={10}>
                  <span>
                    加入时间：{moment(activeUpdateData.gmtCreate).format('YY-MM-DD HH:mm:ss')}
                  </span>
                </Col>

                <Col span={6}>
                  {activeUpdateData.vendorBelong && (
                    <span>
                      客服：
                      <a>
                        <span>{activeUpdateData.vendorBelong.belongEmployeeName}</span>
                      </a>
                    </span>
                  )}
                </Col>

                <Col span={2}>
                  <span style={{ color: '#ccc', float: 'right' }}>状态</span>
                </Col>
              </Row>
              <Row style={{ marginTop: 20 }}>
                <Col span={6}>
                  <span>供应商类型： {activeUpdateData.vendorTypeName}</span>
                </Col>
                <Col span={10}>
                  <span>
                    {/* 合作公司: {activeUpdateData.companyName} */}
                    合作公司： 苏州共商网络技术有限公司
                  </span>
                </Col>
                <Col span={8}>
                  <span
                    style={{
                      float: 'right',
                      fontSize: 18,
                    }}
                  >
                    {activeUpdateData.statusName}
                  </span>
                </Col>
              </Row>
            </Col>
          </Row>

运行结果

编辑