Popup duplicates when initially opened and page loads directly (Next.js + Framework7-React)
Chưa có ai nhận issue này.
Đánh giá
- Độ khó
- 3/5
- Thời gian dự kiến
- 1-2 ngày
- Mức phù hợp với người mới
- 45/100
- Loại issue
- Lỗi
- Độ rõ ràng
- Khá rõ ràng
- Mức độ hoạt động
- Ít trao đổi
- Công nghệ
- javascript, next.js, react
Hướng nghiên cứu
Bắt đầu với bản tái hiện được liên kết tại f7-popup-test.vercel.app/popup và kiểm tra lần render ban đầu của trang popup với opened={true}. Tái hiện sự cố bằng cách tải trang và đóng popup, sau đó truy tìm lý do nhiều instance xuất hiện. Hoàn tất khi một popup được mở trực tiếp chỉ render một lần và đóng lại mà không để lại bản trùng lặp trong DOM.
Do mô hình lập chỉ mục viết ra từ nội dung của issue.
Mô tả
- Framework7 version: 8.3.4
- Framework7-React version: 8.3.4
- React version: 19.0.0
- Next.js version: 15.1.7
- Platform and Target: Web / Chrome / Vercel
- Live Link or CodeSandbox: https://f7-popup-test.vercel.app/popup
Describe the bug
When the page loads with a popup initially open (opened={true}), multiple popup instances are created.
After closing the popup, another duplicate popup remains visible meaning more than one instance of the same popup exists in the DOM.
Why popup is open by default and why this is needed?
because the popup is controlled through URL query parameters or hash (for example, when a user directly opens a URL like ?popup=open or #popup that should display the popup on load).
To Reproduce
- Go to https://f7-popup-test.vercel.app/popup (the popup opens automatically on page load)
- Close the popup
- Notice that another popup instance remains open, duplicated on initial render
Expected behavior
Only a single popup instance should exist.
If the popup starts open (opened={true}), it should open once and close normally without leaving duplicates.
Actual Behavior
When the popup starts open on page load, multiple popup instances are rendered.
After closing one, another duplicate popup stays open.
Additional context
This is a minimal reproduction built with Next.js 15.1.7 and Framework7-React 8.3.4:
Repository: https://github.com/khaledsAlshibani/f7-popup-test
- Ngôn ngữ chính
- JavaScript
- Star
- 18.8k
- Fork
- 3.2k
- Chỉ số merge pull request
- Không có pull request nào được merge trong 30 ngày
Hướng dẫn đóng góp
Bắt đầu từ đâu
- Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
- Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
- Fork repository và làm thay đổi trên một nhánh.
- Mở pull request có tham chiếu số hiệu của issue.
Issue khác của framework7io/framework7
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 68/100
framework7io/framework7#4365 · 1 bình luận ·
-
propsHistory Đang mở
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 72/100
framework7io/framework7#4347 · 1 bình luận ·
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 64/100
framework7io/framework7#4222 · 3 bình luận ·
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 65/100
framework7io/framework7#4175 · 1 bình luận ·
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 65/100
framework7io/framework7#3969 · 3 bình luận ·
Tất cả issue của framework7io/framework7
Issue tương tự
-
Update HugeIcons library Đang mở
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 65/100
antfu-collective/icones#398 ·
-
ECmail.com Đang mở
Độ khó 1/5 Dưới một giờ Mức phù hợp với người mới 90/100
wesbos/burner-email-providers#554 ·
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 65/100
radiantearth/stac-browser#1023 ·
-
HMR stops working Đang mở
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 75/100
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 75/100
components-web-app/docs#92 ·