ButtonComponent
Official
A button component.
Import:
import { ButtonComponent } from 'obsidian';Signature:
export class ButtonComponent extends BaseComponentExtends: BaseComponent
Constructor
new ButtonComponent(containerEl: HTMLElement)Constructor.
To get the constructor instance, use getButtonComponentConstructor from obsidian-typings/implementations.
Properties
| Property | Type | Description | |
|---|---|---|---|
| buttonEl | HTMLButtonElement | The HTML element representation of the button. | |
| disabled | boolean | Whether the component is disabled. (Inherited from BaseComponent) |
Methods
| Method | Returns | Description | |
|---|---|---|---|
| clickCallback() | void | The function that's called after clicking the button. | |
| onClick(callback) | this | Sets the click event callback for the button component. | |
| removeCta() | this | Removes the call to action style from the button component. CTA stands for call to action. | |
| removeDestructive() | this | Removes the destructive style from the button component. | |
| setButtonText(name) | this | Sets the text for the button component. | |
| setClass(cls) | this | Sets the class for the button component. | |
| setCta() | this | Sets the button component to a call to action button. CTA stands for call to action. It changes how the button is styled, to make it stand out. Use it sparingly, to make the button stand out from others nearby. | |
| setDestructive() | this | Style the button as destructive (e.g. for actions that delete data or are otherwise hard to undo). Compose with setCta for a destructive primary action. | |
| setDisabled(disabled) | this | Sets the disabled state of the button component. | |
| setIcon(icon) | this | Sets the icon for the button component. | |
| setLoading(loading) | this | Toggles the button's loading state. | |
| setTooltip(tooltip, options?) | this | Sets the tooltip for the button component. | |
| setWarning() | this | Sets the button component to a warning button. Usually it's added to buttons that perform destructive actions, such as deleting user's data. | |
| then(cb) | this | Facilitates chaining. (Inherited from BaseComponent) |
Links to this page: