スタイル付きコンポーネントの使用は、Antのデザインスタイルを変更します

あなたが問題を検索し、私は確かに同じ混乱が発生した、私は部品のAntのデザインを使用したい場合は、いくつかは、ラベル名の競合はどのように行う独自のスタイルスタイルの成分の変化を使用したいですか？直接上のコード....

インポートは「反応」からリアクト。
「antd」からインポート{入力、ボタン、リスト}。インポート{btnStyle、inputStyle、listStyle} ./style 'から 
CONST TodoListUI =（小道具）=> { 
    リターン（


        < divのスタイル= {{ マージン： '20ピクセル'}} > 
            < 入力スタイル= {inputStyle}値= {小道具.inputValue} のonChange = {props.handleInputChange} /> 
            < ボタンスタイル= {btnStyle}入力= "危険性" のonClick = {props.handleBtnClick} >提交</ ボタン> 
            <= {listStyle}ボーダーのdataSource = {props.list}
                 のRenderItem = {
                     （項目、指数）= >  < リスト.ItemのonClick = {（）= > {props.handleItemDelete（インデックス）}}> {アイテム} </ リスト。項目> } 
            /> 
        </ DIV > 
    ）
} 
輸出デフォルトTodoListUI。

style.js（cssファイルは、コードを書くことです）

「スタイル・コンポーネントのスタイルから輸入。

エクスポートCONST btnStyle = { 
　　背景： 'ピンク' 
} 
エクスポートCONST inputStyle = { 
    幅： '300ピクセル' 、
    マージン： '20ピクセル' 、
} 
エクスポートCONST listStyle = { 
    幅： '300ピクセル' 、
    マージン： '20ピクセル' 、
}

今、おそらくそれを使用する方法を知っています。style.jsファイルで直接あなたが直接antdでのUIコンポーネントのオリジナルのスタイルを変更するために導入されたカスタムCSSコードを必要とする良い定義します。