2017-01-19 3 views
1

을 렌더링하여 react-bootstrap Panels 배열을 전달했습니다. 각 행을 측정하고 자식 콜백을 통해 자식 패널 중 하나를 클릭 할 때마다 부모 상태의 특성이 업데이트됩니다. 이 속성은 해당 패널이 현재 확장되어 있는지 여부를 확인하기 위해 react-virtualized ListrowHeight() 함수 내부에서 사용됩니다. 그런 다음 내 Listref을 사용하여 나는 refrecomputeRowHeights(index)forceUpdateGrid() 메서드를 호출합니다.반응 가상화 된 목록 내에서 접을 수있는 패널 사용

List 구성 요소가 내 행의 높이와 위치를 올바르게 업데이트하지만, 애니메이션이 매끄럽지 않습니다. 즉, 부트 스트랩 확장 애니메이션은 잘 작동하지만 확장 된 행의 높이 변화는 click 이벤트 이후에 즉시 발생하고 애니메이션이 시작되어 다소 흐릿한 느낌을줍니다.

이 문제에 대한 해결 방법이 있는지 궁금한 점이 있거나 react-virtualized의 업무 기능에서 예정/예정/예정인지 궁금합니다.

고맙습니다.

+0

안녕하세요 Ramiro! 불행히도 반응 가상화로 애니메이션 크기를 조정하거나 최적화하는 데 많은 시간을 투자하지 않았습니다. 당신이 언급 한 경우 크기 조절/위치 변경이 조금 고르지 않다는 것을 듣고 놀랍지는 않습니다. Plnkr (또는 이와 유사한)으로서 나와 구현을 공유 할 수 있다면 한 번 해보고 제안 할 수있어서 기쁩니다. – brianvaughn

+0

@brianvaughn 감사합니다. Brian !! [plunk] (https://plnkr.co/edit/SSzHqu8Ta18Oef80Eyzd?p=preview) 할 수있는 것이 더 좋습니다. 당신이 xD를 보게 될 재난에 대해 진심으로 사과드립니다. 원래 프로젝트에서 축소했을 때 뭔가를 놓쳤을 가능성이 있습니다. 다시 한번 시간을내어 주셔서 감사합니다! –

+0

문제 없습니다. 다음은 애니메이션을 추가 할 수있는 방법 중 하나 인 빠르고 빠진 예제입니다. https://plnkr.co/edit/VanCAQmSkUejp3hbJUyJ?p=preview. 버그가 없다는 의미가 아니라 단지 일러스트레이션입니다. : D – brianvaughn

답변

1

불행히도 반응 가상화에서 애니메이션 크기를 조정하거나 최적화하는 데 많은 시간을 투자하지 않았습니다. 당신이 언급 한 경우 크기 조절/위치 변경이 조금 고르지 않다는 것을 듣고 놀랍지는 않습니다.

다음은 애니메이션을 추가 할 수있는 방법 중 하나입니다. plnkr.co/edit/VanCAQmSkUejp3hbJUyJ?p=preview. 버그가 없다는 의미가 아니라 단지 일러스트레이션입니다. : D

관련 문제