材料 - UIチェックボックスのカラー化

Question

material-ui.com-frameworkを使用している場合、アクティブなチェックボックスの背景色を変更するにはどうすればよいですか？ style-propertyは、チェックボックスのsvg-colorには影響しません。

  <Checkbox 
      label="Simple" 
     style={styles.checkbox} 
     /> 

Answer 1

はdocsによると、あなたは、テーマを使用して、この方法でコンポーネントのスタイルを設定することができます。

定義済みのテーマを使用することも、custom themeを作成することもできます。例えば は、あなたがのような単純なことができ何をしたい達成：キーで基本テーマを拡張しますレンダリング機能であなたがthemeProviderを使用することができますし、カスタムtheme.Thisに渡し、その後、

import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'; 
import getMuiTheme from 'material-ui/styles/getMuiTheme'; 
import Checkbox from 'material-ui/Checkbox'; 

const myTheme = getMuiTheme({ 
    checkbox: { checkedColor: 'red' } 
}); 

とあなた変更されました。

render() { 
    return (
     <MuiThemeProvider theme={myTheme}> 
      <Checkbox /> 
     </MuiThemeProvider> 
    ); 
}