События

События — это то, как Reflex реагирует на действия пользователя, такие как нажатие кнопки, отправка формы или наведение курсора на элемент. В Reflex события вызывают обработчики событий в вашем классе State.

Обработчики событий

Обработчик событий — это метод в вашем классе состояния, который имеет логику.

class CounterState(rx.State):
    count: int = 0

    def increment(self):
        self.count += 1

Вы подключаете это в своем пользовательском интерфейсе, используя реквизиты компонента:

rx.el.button("Add", on_click=CounterState.increment)

Асинхронные обработчики и доходность

Если обработчик событий выполняет длительную задачу (например, вызов API), он должен быть async. Reflex также позволяет вам выполнять действия для постепенного обновления пользовательского интерфейса.

class SearchState(rx.State):
    results: list[str] = []
    loading: bool = False

    async def run_search(self, query: str):
        self.loading = True
        yield  # Update UI to show loading spinner

        # Simulate API call
        await asyncio.sleep(2)
        self.results = ["Result 1", "Result 2"]

        self.loading = False

Цепочка событий

Вы можете вызвать несколько событий из одного взаимодействия, передав список в свойство event.

rx.el.button(
    "Save", 
    on_click=[
        State.save_data,
        rx.toast("Data Saved!"),
        rx.redirect("/dashboard")
    ]
)

Общие триггеры событий

Триггеры, которые можно прикрепить к компонентам Reflex:

Специальные действия

Reflex предоставляет встроенные «Специальные действия», которые могут быть вызваны обработчиками: