Ant-design: `prefixCls`は一部のコンポーネントでは継承されません

作成日 2018年06月09日  ·  4コメント  ·  ソース: ant-design/ant-design

これは、 prefixClsの問題を追跡するための包括的な問題です。

  • []#10017タグ:prefixClsがアイコンに渡されません
  • []#10565モーダル:prefixClsがButtonに渡されない
  • [x]#12546 Modal.xxx:prefixClsがマスクに渡されません
  • []#10042アップロード-ドラッガー:prefixClsをUploadListに渡す-アップロード
  • []転送
  • []#12676 Popconfirm:prefixClsがButtonに渡されません
Inactive IssueHuntFest help wanted

最も参考になるコメント

内部の議論から:

prefixCls構成用にConfigProviderという新しいプロバイダーを紹介します。

import { ConfigProvider, Button } from 'antd';

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

生成:

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

全てのコメント4件

Inputもリストに含めるべきだと思います。

import 'antd/dist/antd.less'または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);
}

import 'antd/dist/antd.css'を使用している間、ブラウザ固有のプレフィックスがあります

.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同じ問題ではありません。

内部の議論から:

prefixCls構成用にConfigProviderという新しいプロバイダーを紹介します。

import { ConfigProvider, Button } from 'antd';

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

生成:

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

#12991で解決

このページは役に立ちましたか?
0 / 5 - 0 評価