Beacon Tooltip

A leckében elhelyezett komponens, amely önállóan vagy egy "célponthoz" csatolva elhelyez egy jelzőfényt. A jelzőfényre való lebegtetés vagy kattintás után egy tooltip jelenik meg.

Opciók

• title | (string|node): a tooltip tetején megjelenítendő cím. Default: none.
• content | (string|node): tooltip tartalom. Default: 'content comes here...'.
• event | string: ha click-re van állítva, akkor a tooltip a jelzőfényre kattintva változik; ha hover-re van állítva, akkor a tooltip a lebegtetéssel aktiválódik.. Default: 'click'.
• placement | string: a tooltip elhelyezése a célponthoz képest (vagy top, top-kezdet, top-vég, alul, alul-vég, bal, bal-kezdet, bal-vég, jobb, jobb-kezdet, jobb-vég, auto vagy center). Default: 'left'.
• target | string: osztály vagy ID szelektor az elemhez, amelyhez a tooltip csatolandó. Default: ''.
• offset | number: a tooltip és a célpont közötti távolság pixelben. Default: 15.
• onChange | function: callback, amelyet az eszköztár állapotváltásakor hívnak meg. Két argumentumot kap: az "action"-t ("open" vagy "close") és az átadott "props"-t.. Default: onChange() {}.

Példák

Élő szerkesztő

<BeaconTooltip content="Body of the tooltip..." title="Title comes here..." event="hover" placement="right" />

<BeaconTooltip
    content="Body of the tooltip..."
    title="Title comes here..."
    event="hover"
    placement="right"
/>

Eredmény

ReferenceError: Provider is not defined