Das Hintergrundbild ist nicht für die React-Schaltfläche eingestellt

Question

Ich habe 6 Schaltflächen, die zugeordnet werden, und ich möchte jedem der Schaltflächen einen Hintergrund zuweisen.

button(x) { 
    console.log(x.image) # Gives correct URL for image for button 
    var modalButton = { 
     backgroundImage: x.image 
    } 

    return (
     <Button style={modalButton}>Clickity Click</Button> 
    ) 
} 

render() { 
    <div> 
     {_(this.state.data).map((x) => this.button(x))} 
    </div> 
} 

Dies funktioniert jedoch nicht. Soweit ich weiß, ist backgroundImage ohne den Bindestrich die korrekte Syntax für Inline-CSS.

Answer 1

Sie benötigen

var modalButton = { 
    backgroundImage: 'url(' + x.image + ')' 
} 

zu tun, es sei denn, Sie haben, dass in der x.image Variable enthalten. Die Bereitstellung von mehr Code wird dies verdeutlichen.