Python Shiny实现重置按钮：恢复输入值与图表至初始状态

问题背景 #

原示例通过点击「Go!」按钮触发直方图更新，且使用reactive.isolate()避免滑块值变化时自动刷新图表。新增「Reset」按钮后，仅能将滑块重置为初始值500，但直方图需手动点击「Go!」才会更新，无法同步触发图表刷新。

问题原因 #

原plot输出函数仅依赖input.go()的点击事件，重置按钮的操作并未触发该依赖，因此图表不会自动更新。

解决方案 #

有两种可行方案实现重置时同步更新图表：

方案一：让图表同时响应「Go!」和「Reset」按钮 #

修改plot函数的触发条件，使其同时监听两个按钮的点击事件，这样无论是点击「Go!」还是「Reset」，都会触发图表更新。

方案二：重置时模拟「Go!」按钮的点击动作 #

在重置滑块值后，通过更新「Go!」按钮的点击计数，间接触发图表的依赖更新。

完整代码示例 #

方案一代码： #

import matplotlib.pyplot as plt
import numpy as np

from shiny import App, Inputs, Outputs, Session, reactive, render, ui

app_ui = ui.page_fluid(
    ui.input_slider("n", "Number of observations", min=0, max=1000, value=500),
    ui.input_action_button("go", "Go!", class_="btn-success"),
    ui.input_action_button("reset", "Reset", class_="btn-success"),
    ui.output_plot("plot"),
)


def server(input: Inputs, output: Outputs, session: Session):
    @output
    @render.plot(alt="A histogram")
    # 让plot同时响应go和reset按钮的点击
    @reactive.event(input.go, input.reset)
    def plot():
        np.random.seed(19680801)
        x = 100 + 15 * np.random.randn(input.n())

        fig, ax = plt.subplots()
        ax.hist(x, bins=30, density=True)
        return fig

    @reactive.Effect
    @reactive.event(input.reset)
    def _():
        ui.update_slider("n", value=500)


app = App(app_ui, server)

方案二代码： #

import matplotlib.pyplot as plt
import numpy as np

from shiny import App, Inputs, Outputs, Session, reactive, render, ui

app_ui = ui.page_fluid(
    ui.input_slider("n", "Number of observations", min=0, max=1000, value=500),
    ui.input_action_button("go", "Go!", class_="btn-success"),
    ui.input_action_button("reset", "Reset", class_="btn-success"),
    ui.output_plot("plot"),
)


def server(input: Inputs, output: Outputs, session: Session):
    @output
    @render.plot(alt="A histogram")
    def plot():
        input.go()
        with reactive.isolate():
            np.random.seed(19680801)
            x = 100 + 15 * np.random.randn(input.n())

        fig, ax = plt.subplots()
        ax.hist(x, bins=30, density=True)
        return fig

    @reactive.Effect
    @reactive.event(input.reset)
    def _():
        # 重置滑块值
        ui.update_slider("n", value=500)
        # 模拟Go按钮点击：增加按钮的点击计数，触发plot的依赖
        ui.update_action_button("go", value=input.go() + 1)


app = App(app_ui, server)

说明 #

• 方案一更直接，通过@reactive.event同时绑定两个按钮作为触发源，逻辑清晰。
• 方案二保留了原代码中reactive.isolate()的使用场景，适合需要严格控制触发条件的情况。

内容的提问来源于stack exchange，提问作者Eaque Arcana