docs: data changes example for Pagination

Author: Col0ring

docs/components/antd/pagination/README-zh_CN.md

@@ -5,3 +5,9 @@ A long list can be divided into several pages, and only one page will be loaded
 ## Examples
 
 <demo name="basic"></demo>
+
+### Data Changes
+
+The `Pagination` component is not designed as a data component and cannot be placed in the inputs of other events, but you can get the changed value of the pagination through the pagination change event. If you need to persist the page data, you can save it to `gr.State`
+
+<demo name="data_changes">

docs/components/antd/pagination/README.md

@@ -5,3 +5,9 @@ A long list can be divided into several pages, and only one page will be loaded
 ## Examples
 
 <demo name="basic"></demo>
+
+### Data Changes
+
+The `Pagination` component is not designed as a data component and cannot be placed in the inputs of other events, but you can get the changed value of the pagination through the pagination change event. If you need to persist the page data, you can save it to `gr.State`
+
+<demo name="data_changes">

docs/components/antd/pagination/demos/data_changes.py

@@ -0,0 +1,35 @@
+import gradio as gr
+import modelscope_studio.components.antd as antd
+import modelscope_studio.components.base as ms
+
+
+def on_change(e: gr.EventData, state_value):
+    page = e._data["payload"][0]
+    page_size = e._data["payload"][1]
+    state_value["page"] = page
+    state_value["page_size"] = page_size
+    return state_value
+
+
+def on_click(state_value):
+    gr.Info(
+        f"Page: {state_value['page']}, Page Size: {state_value['page_size']}")
+
+
+with gr.Blocks() as demo:
+    state = gr.State({"page": 1, "page_size": 10})
+    with ms.Application():
+        with antd.ConfigProvider():
+            with antd.Flex(vertical=True, gap="middle"):
+                pagination = antd.Pagination(
+                    total=85,
+                    show_quick_jumper=True,
+                    show_size_changer=True,
+                )
+                btn = antd.Button("Show me the page",
+                                  type="primary",
+                                  block=True)
+    pagination.change(fn=on_change, inputs=[state], outputs=[state])
+    btn.click(fn=on_click, inputs=[state], outputs=[btn])
+if __name__ == "__main__":
+    demo.queue().launch()