Страница не прокручивается наверх в молнии продаж

Question

В компоненте молнии salesforce у нас есть три различных элемента div, которые мы скрываем и показываем по мере необходимости, используя свойство display none css. Fist div имеет больше содержимого, и нам нужно прокрутить страницу до конца, чтобы отправить форму, и при отправке видна следующая страница, которая имеет несколько строк контента, но нам нужно прокрутить вверх, чтобы увидеть это содержимое. Есть ли способ, которым я могу избежать прокрутки. Второй div принимает высоту первого div.

Answer 1

Вы можете попробовать это в своем doInit метод контроллера:window.scroll(0, 0);

Answer 2

Используйте код ниже. В качестве Salesforce Lightning используйте CSS-свойство transform для прокрутки. Просто примените класс 'scroller' к div, который вы хотите поместить сверху.

var cssScrolltoTop = $(".scroller"); // css class to find scroll position
    if (cssScrolltoTop) {
        var cssScrolltoTopTransform = cssScrolltoTop.css("transform");
        if (cssScrolltoTopTransform) {
            cssScrolltoTop.css("transform", "translate3d(0px, 0px, 0px)"); //set 'transform' since lighntning architecture uses css 'transfrom' property to scroll 
        }
    }

Answer 3

Я столкнулся с похожими проблемами, затем мы использовали это событие в контроллере для изменения размера div:

$A.get("e.ui:updateSize").fire();

Позже это было объявлено устаревшим в Salesforce, тогда мы завернули div, который расширяется / разворачивается:

<ui:scrollerWrapper >
// Add your <div>
</ui:scrollerWrapper>

Answer 4

Чтобы scrollTop = 0 работал, контейнер div должен иметь внутреннюю прокрутку. Что мы можем получить, задав высоту через px или через vh.

Попробуйте, должно сработать. Я столкнулся с похожей проблемой при добавлении LWC внутрь Flexi Page. На странице Flexi есть собственный скроллер, но для этого scrollTop не работает. Но если мы создадим отдельный скроллер в div верхнего уровня, то scrollTop начнет работать.

Проверь это. Я создал это, и оно отлично работает для меня: https://webcomponents.dev/edit/3vpWJ46hxykfPSACfuNN