Bedingtes einzelnes Attribut in reagieren?

Question

Gibt es eine kürzere/Inline-Version von dies in Reaktion zu tun, grundsätzlich ein einzelnes CSS-Attribut bedingt anwenden?

setStyle() { 
    const style = { 
     display: 'flex', 
     flexDirection: 'column', 
     height: 485 
    } 
    if (this.state.zoom) { 
     style.position = 'absolute' 
    } 
    return style 
    } 

    <div ref='container' style={this.setStyle()}> 

Etwas in diesem Zusammenhang:

style={{ 
    display: 'flex', 
    flexDirection: 'column', 
    height: 485 
    position: absolute // Make this conditional 
}} 

Answer 1

Mit Object.assign

let style = Object.assign({ 
    display: 'flex' 
}, this.state.zoom && { position: 'absolute' }) 

Mit spread/rest properties

let style = { 
    display: 'flex', 
    ...this.state.zoom && { position: 'absolute' } 
} 

Inline, Inline:

<div 
    style={ 
    Object.assign({ 
     display: 'flex' 
    }, this.state.zoom && { position: 'absolute' }) 
    } 
/> 

<div 
    style={{ 
    display: 'flex', 
    ...this.state.zoom && { position: 'absolute' } 
    }} 
/>