2017-05-20 15 views
0

this tutorial을 따라 갔다가 부스트 랩 문서의 사이드 메뉴를 복제했습니다.Turbolinks and Scrollspy

모든 것이 잘 작동하는 것처럼 보이지만 하위 메뉴에서 앵커 태그를 클릭하면 현재 하위 메뉴가 축소됩니다. 다음 하위 메뉴 섹션으로 스크롤하면 하위 메뉴가 다시 열리고 제대로 다시 작동합니다. 그러나 클릭 된 앵커 태그로 다시 스크롤하면 하위 메뉴가 다시 축소됩니다.

터보 링크를 끄면이 문제를 해결할 수 있지만 터보 링크를 유지하면서 문제를 해결하기를 희망했습니다.

답변

1

불행히도 내가 겪고있는 문제를 재현하지 못했습니다. 따라서 공유 할 수있는 예가 있으면 도움이 될 것입니다.

터보 링크가 동일한 페이지 앵커를 처리하는 방식에 버그가있을 수 있습니다. 현재 페이지를 다시로드 한 다음 요소로 스크롤하는 것이 아니라 요소로 스크롤합니다. 이 버그는 Turbolinks 저장소 (https://github.com/turbolinks/turbolinks/issues/75)에 기록되어 있습니다.

$(document).on('turbolinks:click', function (event) { 
    if (event.target.getAttribute('href').charAt(0) === '#') { 
    return event.preventDefault() 
    } 
}) 

약간의 단점이 버튼 문제가 다시 발생할 수 있다는 것입니다 : 한 가지 가능한 솔루션은 Turbolinks가 같은 페이지 앵커 클릭에 페이지를 다시로드 방지하는 것입니다. 그렇지 않으면 페이지가로드 된 후에 관련 선택에 .scrollspy('refresh')을 호출하여 실험 할 수 있습니다 (http://getbootstrap.com/javascript/#scrollspy-methods 참조).