如何在Taipy页面点击跳转后实现页面间信息交互

问题背景 #

在main.py中定义了页面路由及全局变量：

pages = {
    "/": root_md,
    "Page-MAP": page1_md,
    "Page-DASHBOARD": page2_md,
}

variable_main = "station1"

需求为点击Page-MAP页面跳转至Page-DASHBOARD时，传递变量并更新后者的station_name内容。当前点击事件仅修改页面局部变量，无法同步到目标页面。

解决步骤 #

1. 改用全局state存储共享变量

原代码中state['Page-MAP'].variable_main是页面局部变量，仅作用于Page-MAP，需改为全局state存储以实现跨页面访问。修改Page-MAP的点击事件函数：

def on_change(state, var_name, var_value):
    # 将变量赋值到全局state，而非页面局部
    state.variable_main = "station 2"
    navigate(state, to='Page-DASHBOARD')

2. 初始化全局state变量

在main.py中添加全局变量初始化逻辑，确保应用启动时变量被加载到state：

# 初始化全局state变量
def init_state(state):
    state.variable_main = "station1"

（根据框架特性，将该初始化函数绑定到应用启动钩子即可）

3. 修改Page-DASHBOARD页面绑定全局变量

将页面中的station_name直接绑定到全局state.variable_main，修改页面代码：

<|toggle|theme|>
<|layout|columns=1 2 2 2|gap=40px|class_name=card|
<|{image_path}|image|>
### Name: **<|{state.variable_main}|text|raw|>**{: .color-primary}
|>

如果需要保留station_name变量，可在页面代码块中定义：

station_name = state.variable_main

之后继续使用原有的<|{station_name}|text|raw|>即可。

原理说明 #

通过全局state存储共享变量，替代页面局部变量，实现跨页面的数据同步。跳转时修改全局state的值，目标页面绑定该变量后会自动触发内容更新。

内容的提问来源于stack exchange，提问作者Jérémie Marchand