Open luyimei opened 4 years ago
I have submitted a PR, and I test it inside my project and it works as expected. Please take a look :)
I realize this issue is from a while back, but I wanted to share my experience as I ended up here while troubleshooting a similar concern. In my case, I was using ReactQuill
along with quill-mention, and encountered an issue where the mention list was being cut off due to a parent container having an overflow setting applied.
I found that adjusting the positioningStrategy: 'absolute' | 'fixed' | 'normal'
option in quill-mention to 'fixed' resolved the cut-off issue of the mention list. Specifically, this change moves the mention list from being positioned 'absolute'
within the .ql-editor
to essentially functioning like React's createPortal, attaching it directly to the body element. This effectively makes it immune to the overflow settings of any parent elements.
I hope this insight might prove useful to others who are exploring different ways to position the popup in relation to the container quill editor, especially if they are encountering similar challenges :)
The
defaultMenuOrientation
option position the popup-mention-list relative to the browser window. For example, it will position the popup at left when met the browser window right edge. Is there a way to position the popup relative to the container quill editor? I run into a problem that the popup is cropped and i find out no way to fix it due to the weird css overflow behavior