Ant-design: `prefixCls` n'est pas hérité dans certains composants

Créé le 9 juin 2018  ·  4Commentaires  ·  Source: ant-design/ant-design

Il s'agit d'un problème général pour suivre le problème de prefixCls .

  • [] # 10017 Tag: prefixCls non transmis à Icon
  • [] # 10565 Modal: prefixCls non transmis à Button
  • [x] # 12546 Modal.xxx: prefixCls non transmis au masque
  • [] # 10042 Upload - Dragger: transmettez prefixCls à UploadList - Upload
  • [ ] Transfert
  • [] # 12676 Popconfirm: prefixCls non transmis à Button
Inactive IssueHuntFest help wanted

Commentaire le plus utile

À partir de discussions internes:

Nous allons introduire un nouveau fournisseur appelé ConfigProvider pour la configuration de prefixCls .

import { ConfigProvider, Button } from 'antd';

<ConfigProvider prefixCls="awesome-">
  <Button>A Button</Button>
</ConfigProvider

produit:

<button type="button" class="awesome-btn"><span>A Button</span></button>

Tous les 4 commentaires

Je crois que Input devrait également être inclus dans la liste.

Lorsque vous utilisez import 'antd/dist/antd.less' ou import 'antd/lib/input/style' ;

.ant-input-affix-wrapper .ant-input-prefix, .ant-input-affix-wrapper .ant-input-suffix {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    line-height: 0;
    color: rgba(0, 0, 0, 0.65);
}

Lors de l'utilisation de import 'antd/dist/antd.css' aurait le préfixe spécifique au navigateur

.ant-input-affix-wrapper .ant-input-prefix, .ant-input-affix-wrapper .ant-input-suffix {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    line-height: 0;
    color: rgba(0, 0, 0, 0.65);
}

@chungwong Pas le même problème.

À partir de discussions internes:

Nous allons introduire un nouveau fournisseur appelé ConfigProvider pour la configuration de prefixCls .

import { ConfigProvider, Button } from 'antd';

<ConfigProvider prefixCls="awesome-">
  <Button>A Button</Button>
</ConfigProvider

produit:

<button type="button" class="awesome-btn"><span>A Button</span></button>

Il est résolu via # 12991

Cette page vous a été utile?
0 / 5 - 0 notes