как я могу рассчитать позицию прокрутки всплывающего окна (reactjs -popup)? - PullRequest
0 голосов
/ 19 июня 2020

У меня есть всплывающее окно в заголовке моей таблицы реакций

const column = [{
    Header: () =>
        <div>
            <Popup className="column-order-popup"
                   closeOnDocumentClick
                   open={wasPopupOpen}
                   repositionOnResize
                   trigger={<div className="eye-icon">
                       <img src={icon}/>
                   </div>}
                   on="click"
                   position="bottom left">
                <div className="column">
                    {generate()}
                </div>
            </Popup>
        </div>,
    fixed: "left",
    sortable: false,
    headerClassName: "table-header-class",
    className: "table-row-class",
    width: 70
}];


const generate = () => {
    return (
                        <div className="checkbox-react-table">
                            <img onClick={(e) => handleToggleShowColumnClick()} alt="image"
                                 src={checkboxMarked}/>
                        </div>
    )
};

    const handleToggleShowColumnClick = () => {
... some removes from array...
        setWasPopupOpen(false);
        setWasPopupOpen(true);
    };

У меня есть флажок внутри всплывающего окна, который устанавливает видимость столбца, поэтому он повторно отображает aws таблицу. После того, как я установил флажок, всплывающее окно закрывается - я думаю, это из-за повторного рендеринга.

Мне не нравится такое поведение, и я установил wasPopupOpen в false, а затем в true. Он открывается снова, но с другой позицией прокрутки.

Итак: 1. Можно ли избежать закрытия всплывающего окна при повторном рендеринге, и если да, то как? 2. Если нет, то как я могу рассчитать положение прокрутки всплывающего окна и установить его снова после того, как всплывающее окно снова откроется?

PS Я установил свой div с всплывающим окном с ref. Я объявил следующее

const popupRef = useRef(null);

const scrollToRef = (ref) => window.scrollTo(10, 33, ref.current.offsetTop)

useEffect(() => {
    console.log(popupRef)
    scrollToRef(popupRef)

})

главное окно - изменение всплывающего контейнера. Мне нужно изменить прокрутку всплывающего окна

Спасибо!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...