सामग्री-ui दराज की ऊंचाई

Question

मैं अपनी परियोजना में प्रतिक्रिया और सामग्री-ui का उपयोग कर रहा हूं और मैं एक साधारण मुद्दे पर आया हूं कि मुझे नहीं पता कि कैसे हल किया जाए। मैं एक दराज बनाना चाहता हूं और अपनी ऊंचाई को इस तरह से सेट करना चाहता हूं कि जब यह खुल जाएगा, तो यह ऐप बार पर खुल जाएगा नहीं।

ऊंचाई के लिए दराज घटक में कोई पैरामीटर नहीं है, मैं भी अपनी शैली को ओवरराइड और इस तरह शैली वस्तु पर ऊंचाई की स्थापना करने की कोशिश की:

<Drawer style={{height:'90%'}} /> 

लेकिन यह काम नहीं किया।

एकमात्र तरीका जिसे मैं सोच सकता हूं, ड्रॉवर घटक के कोड को संपादित कर रहा है, लेकिन मैं इसे टालना चाहता हूं।

कोई विचार कि मैं ऊंचाई को कैसे परिभाषित कर सकता हूं?

Answer 1

ये रहा:

<Drawer open={this.state.open} containerStyle={{height: 'calc(100% - 64px)', top: 64}}> 
    <MenuItem>Menu Item</MenuItem> 
    <MenuItem>Menu Item 2</MenuItem> 
</Drawer> 

Answer 2

containerStyle संस्करण 1.0 में और

ऊपर निषिद्ध है तो तुम रंगमंच की सामग्री कक्षाएं उपयोग करने की आवश्यकता के बजाय

यहाँ इस nontrivial के लिए एक उदाहरण है केस

import {withStyles, createStyleSheet} from 'material-ui/styles' 
const styleSheet = createStyleSheet({ 
    paper: { 
    height: 'calc(100% - 64px)', 
    top: 64 
    } 
}) 
class CustomDrawer extends Component { 
    ... 
    render() { 
    const classes = this.props.classes 
    return (
     <Drawer 
     classes={{paper: classes.paper}} 
     > 
     ... 
    ) 
} 

CustomDrawer.propTypes = { 
    classes: PropTypes.object.isRequired 
} 

export default withStyles(styleSheet)(CustomDrawer)