재질 - UI가 포함 된 AppBar

Question

AppBar를 프로그래밍하려고했습니다. 불행히도 성공하지 못했습니다. Google의 웹 앱은 템플릿으로 사용되었습니다. Google은 전체 크기 메뉴 (모바일에서 사이드 메뉴 + 햄버거로 자동 축소) 및 검색 창으로 웹 앱을 구현합니다. 인터넷에서 몇 시간을 검색해도 결과가 나오지 않았습니다. 누가 을 AppBar로 프로그래밍하고 소스 코드를 사용할 수 있습니까?

나는이 코드를 예제에서 시도했다. 이 예에서 코드는이 오류 메시지입니다 /src/index.js

import React, { Component } from 'react';  
import ReactDOM from 'react-dom';  
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';  
import AppBar from 'material-ui/AppBar';         
import registerServiceWorker from './registerServiceWorker';  

class App extends Component {                    
    render() {                        
    return (                        
     <MuiThemeProvider>                     
     <AppBar />                      
     </MuiThemeProvider>                     
    );                         
    };                          
};                          

ReactDOM.render(<App />, document.getElementById('root'));            
registerServiceWorker();      

에 있습니다

bundle.js:37989 Warning: Failed prop type: The prop `theme` is marked as required in `MuiThemeProvider`, but its value is `undefined`. 
    in MuiThemeProvider (at index.js:10) 
    in App (at index.js:17) 

Answer 1

당신이 반응에서 물질 UI와 앱 줄을 재현 this 튜토리얼을 볼 수 있습니다. 원래 포스터에 의해

업데이트 오류 후 포스트, 코멘트 :

아래 패턴에 따라 테마 소품을 전달할 수 있습니다 : 당신은 here에서 전체 코드를 찾을 수 있습니다

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

... 

const muiTheme = getMuiTheme({ 
    palette: { 
    textColor: cyan500, 
    }, 
    appBar: { 
    height: 50, 
    }, 
}); 

... 

<MuiThemeProvider muiTheme={muiTheme}> 
    <AppBar title="My AppBar" /> 
</MuiThemeProvider> 

.