私は反応が新しく、bsClassとclassNameの間の概念を理解できませんでした。bsClassとclassNameをreact-bootstrapで使用する点の違いは何ですか？
私は次のように、修正ボタンのスタイルを実装しよう：
私はclassNameと
bsClassを代用するとき、それは動作しません
<Button bsClass="btn-custom" >Custom button</Button>
。
しかし、他の部分には、同じのcustom.cssソースを使用して、私が実装します。
<img src={logo} alt="logo" className="app-logo" />、それが動作します。
JSX属性classNameは、HTML classに相当します。それはButtonに渡されているpropある
<Button bsClass="btn-custom" >Custom button</Button>
に考えられているbsClassあたりのようにJSX
の下<span className="app-logo">Logo</span>
は、HTMLで以下
<span class="app-logo">Logo</span>
と同等になりますコンポーネントの中にclassNameを設定するために使用するものです
<button className={this.props.bsClass}>{this.props.children}</button>
したがって、react-bootstrapドキュメントによってプロパティとして定義されている属性です。
リアクトのclassNameは、CSSの通常のクラスとまったく同じです。
HTML/CSS：
<div class='red-text'>
Foo
</div>
は/ JSXに反応：
<div className='red-text'>
Foo
</div>
上記のコードスニペットは、まったく同じことを行います。 （classの代わりに）classNameをReactに使用することに固執している唯一の理由は、「class」が既にJavaScriptで予約されているキーワードであるためです。
他の人が述べたように、bsClassは、反応ブートストラップパッケージ内のあらかじめ定義されたクラスです。 BootstrapのCSS版に独自のスタイリングがどのように付属しているかのように、反応起動ストラップも同様です。
実用的な違い。私はbsClassをREACT-Bootstrapがデフォルトとして持っている以外のものに設定しました。あなたはボタンの独自のCSSテーマ設定をしなければなりません。あなたはまだ、デフォルトのテーマを得るが、あなたが今、あなた自身の.css
.xx {
magin-bottom: 2px
}
を使用して、色など、パディング、のCSSスタイルを追加し 'ボタンのドキュメントをチェックすることができます「XX」=クラス名を追加することにより
'コンポーネント。 – zerkms
bsClassはあらかじめ定義されています。コンポーネントに注入する独自のスタイルがあります。 classNameはあなたのCSSを定義する必要があります。 –
Ok。皆さん、ありがとうございます。"コンポーネントの基本CSSクラスと接頭辞。一般的に、新しい、ブートストラップではなく、コンポーネントのCSSスタイルを提供するためだけにbsClassを変更する必要があります" –