Having the code of a tooltip component + a triangle indicator around it, I am supposed to create a property within this component which allows my fellow developers to remove the indicator when necessary. However, the indicator is after my attempts still showing
demo.index.js
return (
<div>
<h1>tooltip Demo</h1>
<Tooltip
title={"Text für Länge des Tooltips - noch länger"}
body={
<span>
Test in Kursiv
</span>
}
hide_indicator={true}
>
<button style={{ width: 200, margin: "0 auto" }}>Tooltip</button>
</Tooltip>
</div>
);
};
What I have tried:
in the src.index.js I have created a function and the react.fragment in the return block taking up this function.
FUNCTION
handleIndicator = node => {
this.setState({
hide_indicator: false,
});
};
RETURN BLOCK
render() {
const { className, classes, light, isHtml, hideIndicator } = this.props;
...
hide_indicator={
<React.Fragment>
<span hide_indicator={true} ref={this.handleIndicator} />
</React.Fragment>
}