Library
/
Forms
/
Button
Buttons are essential elements in your application's user interface that users can click to trigger events. This component uses Radix's button component.
rx.button("Click me")rx.button(
rx.icon(tag="heart"),
"Like",
color_scheme="red",
)The disabled prop disables the button, by default it is False. A disabled button does not respond to user interactions such as click and cannot be focused.
rx.flex(
rx.button("Enabled"),
rx.button("Disabled", disabled=True),
spacing="2",
)The on_click trigger is called when the button is clicked.
rx.button("Click me", on_click=rx.window_alert("Clicked!"))0
class CountState(rx.State):
count: int = 0
def increment(self):
self.count += 1
def decrement(self):
self.count -= 1
def counter():
return rx.flex(
rx.button(
"Decrement",
color_scheme="red",
on_click=CountState.decrement,
),
rx.heading(CountState.count),
rx.button(
"Increment",
color_scheme="grass",
on_click=CountState.increment,
),
spacing="3",
)Trigger an action or event, such as submitting a form or displaying a dialog.
Event Triggers
See the full list of default event triggersDid you find this useful?
No
Yes
