2016-12-21 9 views
1

基本的なReactセットアップと反応するmdl(https://react-mdl.github.io/react-mdl)コンポーネントを使用して自分のレイアウトでWebビューを構築しています。もちろん、テンプレートにmdl cssがあります。 React MDLの引き出しコンポーネントを私のカスタムレイアウトに使用したいと思います。これまでのところ、私は私のレイアウトでこれを持っている:React MDL:スタンドアロンドロワー付きの引き出しボタンなし

<div className="mdl-layout mdl-js-layout mdl-layout--fixed-header"> 
    <Header/> 
    <Drawer title="Title"> 
    <Navigation> 
     <a href="">Link</a> 
     <a href="">Link</a> 
     <a href="">Link</a> 
     <a href="">Link</a> 
    </Navigation> 
    </Drawer> 
</div> 

レンダリング引き出し:

<div class="mdl-layout__drawer"> 
    <span class="mdl-layout-title">Title</span> 
    <nav class="mdl-navigation"> 
    <a href="" class="mdl-navigation__link">Link</a> 
    <a href="" class="mdl-navigation__link">Link</a> 
    <a href="" class="mdl-navigation__link">Link</a> 
    <a href="" class="mdl-navigation__link">Link</a> 
    </nav> 
</div> 

問題は、それがOKレンダリングされますが、生成されたいかなる引き出しボタンはありません。 demo layoutでは、ドロワーdivの横にクラスmdl-layout__drawer-buttonのdivが生成され、レイアウトの最後にdiv mdl-layout__obfuscatorのdivが生成されます。

答えて

0

react-mdlのスクリプトの代わりにmaterial-design-liteのスクリプトを使用して間違いを犯したため、同じ問題が発生しました。

import 'react-mdl/extra/material.css' 
import 'react-mdl/extra/material.js' 

は、この情報がお役に立てば幸い!

関連する問題