Material-UI抽屜問題

我想讓這個抽屜像貼紙一樣粘在頁面上並且處於活動狀態。一切都很好，但每當我滾動下來時，整個抽屜也會向下移動。我該如何解決它？我不希望整個事情在滾動時下移。Material-UI抽屜問題

注：我試圖通過使用docked = {false}來解決這個問題。但使用它可以使整個頁面除抽屜外都處於非活動狀態。

遇到同樣的問題？任何方案？

import React, { Component } from 'react'; 
import Drawer from 'material-ui/Drawer'; 
import MenuItem from 'material-ui/MenuItem'; 

class MenuView extends Component { 
render { 
    return(
    <Drawer open={true} containerStyle={{marginTop: '6.5%', background:'#545454', position:'fixed'}}> 
    <MenuItem primaryText="My Name" style={{color:'white', marginTop:'10%'}} href="#/name" onClick={handlers.changeURL}/> 
    <MenuItem primaryText="My Age" style={{color:'white'}} href="#/age" onClick={handlers.changeURL}/> 
    <MenuItem primaryText="My Address" style={{color:'white'}} href="#/address" onClick={handlers.changeURL}/> 
    <MenuItem primaryText="My Files" style={{color:'white'}} href="#/files" onClick={handlers.changeURL}/> 
    </Drawer> 
); 
} 
} 
export default MenuView;

來源

2017-10-09 Subhojit

你可以爲此創建一個jsfiddle，以便我們看看它。或嘗試在containerStyle中添加css的「Top」屬性。

<Drawer open={true} containerStyle={{top: '0%', background:'#545454', position:'fixed'}}> 
 
    <MenuItem primaryText="My Name" style={{color:'white', marginTop:'10%'}} href="#/name" onClick={handlers.changeURL}/> 
 
    <MenuItem primaryText="My Age" style={{color:'white'}} href="#/age" onClick={handlers.changeURL}/> 
 
    <MenuItem primaryText="My Address" style={{color:'white'}} href="#/address" onClick={handlers.changeURL}/> 
 
    <MenuItem primaryText="My Files" style={{color:'white'}} href="#/files" onClick={handlers.changeURL}/> 
 
</Drawer>

來源

2017-10-09 10:51:23

我想抽屜從上向下放置一點點，所以我給**的** marginTop。沒有必要給**頂部：'0％'**在那裏。 – Subhojit

是的..而不是給予marginTop：'6.5％'，儘量給予頂部：'6.5％' –

沒有區別。我剛剛嘗試過。和以前一樣。當向下滾動頁面時，整個抽屜也會向下移動。 – Subhojit

Material-UI抽屜問題

回答

相關問題