---
# System prepended metadata

title: 如何設計使用者編輯頁的彈跳視窗

---

# 如何設計使用者編輯頁的彈跳視窗
閱讀規格時，不能理解的地方可以透過 [Figma 設計稿的 Prototype](https://www.figma.com/proto/ywr1YFOekgWOWF3YuoXFr6/Capstone%3A-Twitter_2022?node-id=34232%3A1927&scaling=min-zoom&page-id=0%3A1&starting-point-node-id=34232%3A1927) 觀察，大家會看到有些地方會有「彈出視窗」的效果。

例如在「個人資料」頁面中，當使用者點擊「編輯個人資料」的按鈕時，會彈出視窗，但頁面並沒有完全重新整理。

**需要在不影響原本頁面狀態的情況下：**

* 顯示一個彈出視窗元件 (modal)
* 只向資料庫發出請求，取得登入者資料
* 將登入者資料塞進 modal 元件


\
\
[回到首頁](https://hackmd.io/@2022-Oct-Twitter/Hk9m-Pn-j/%2Feax7gnB7R3KcclDqf27iDA%3Fview)