app.jsxファイルでこのようなボタンをレンダリングすると
<button className="myflatbutton">Click For Fun</button>
次に、app.cssファイルのボタン用に作成したスタイルを採用します。つまり、ボタンは、ブラウザーが提供する醜いデフォルトのボタンではありません。ただし、同じ入力type = buttonをこのようなReactクラスでラップすると
var MyReactButton = React.createClass({
render: function(){
return(
<input type="button" onClick={this.props.onButtonClicked} value={this.props.Title} />
)
}
});
app.cssのグローバルボタンスタイルを無視します
button, .button, input[type=submit]{
color: #fff;
border-radius: 0px;
border: none;
//many more omitted for brevity
}
Reactクラスにラップされたボタンを取得して、reactクラスを適用するたびにそれらのスタイルを書き出すことなく使用する方法はありますか?
さて、CSSは間違っていませんか?フィドルは間違いなくここで役立ちます。
あなたのreactコンポーネントはですがinput type="button"
、あなたのcssはinput[type=submit]
です。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加