2016-05-31 22 views
2

奇妙な行動、私はこのコードでアプリケーションバーを作成しようとすると:材質-UIに反応:スタックアプリケーションバー

import React, { Component } from 'react'; 
import getMuiTheme from 'material-ui/styles/getMuiTheme'; 
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'; 
import AppBar from 'material-ui/AppBar'; 

// Needed for onTouchTap 
import injectTapEventPlugin from 'react-tap-event-plugin'; 
injectTapEventPlugin(); 

export default class App extends Component { 
    render() { 
     return (
      <MuiThemeProvider muiTheme={getMuiTheme()}> 
       <div> 
        <AppBar title="Title"/> 
       </div> 
      </MuiThemeProvider> 

     ); 
    } 
} 

結果は私に積み重ねられたアプリケーションバー与える:

enter image description here

を私がしていますそれはなぜそれを行い、似たような問題は見つけられませんでした。 EDIT meteor npm install material-ui

を経由して反応し、材料-UIがインストールされて、私は新鮮な流星インスタンス上で実行しています:調査の後、問題はアプリケーションバーがdisplay:flexを持っていないということであるようです。ただし、手動でstyle={{display:'flex'}}(何も変更されていない)で追加することは不可能です。

+0

奇妙な動作:レスポンスレイアウトを試して、Chromeのインスペクタでページを更新すると、突然動作します。それはまだリフレッシュ後に通常のレイアウトで動作しません。 – Almaju

答えて

1

一つの迅速かつ汚い修正:

とのmain.cssで<AppBar title="Title" className="appBar" />:しかし

.appBar{ 
    display:flex; 
} 

奇妙な行動。

関連する問題