変更するブートストラップのツールチップの色を動的に変更する

Question

反応ブートストラップのツールチップでツールチップの背景色を変更しようとしています。

からpostこれはCSSファイルで変更できます。しかし、私は可能な40の異なる色を表示する必要があります。

私は物事をこの方法でやろうとしてきた：

<Tooltip id={this.props.name} style={{".tooltip_inner":{"background":backgroundColor}}}>{this.props.name}</Tooltip> 

しかし、それだけでは動作しません。レンダリングでtooltip_innerを設定することはできませんし、動的にアクセスする方法がわかりません。私はgetElementsBy-Nameを試しましたが、それはどちらも動作しません。

ありがとうございました。

Answer 1

これはあなたに役立つかどうかを確認します。しかし、それを行うのは非常に反応する（y）方法ではありません。

return (
    <OverlayTrigger placement="top" overlay={this.tooltip} onEntering={this.entering}> 
        <Button">Hover on me</Button> 
    </OverlayTrigger> 
); 

tooltip = (
    <Tooltip id="tooltip"><strong>This is the tooltip. Yeah!</Tooltip> 
); 

// Set your color here 
entering = (e) => { 
    e.children[0].style.borderTopColor = 'green'; 
    e.children[1].style.backgroundColor = 'green'; 
};