2017-02-24 1 views
0

SPA (Single Page Application) 페이지에 CKEditor를 통합하려고합니다.편집자 페이지로 돌아갈 때 CKEditor (SPA의)가 멈 춥니 다.

CKEditor는 처음 방문시 SPA 페이지에서 올바르게 작동하지만 다음 방문시에는 올바르게 작동하지 않습니다. 예를 들어 뒤로 브라우저 화살표 (이전 SPA 페이지를 표시)를 누른 다음 앞으로 화살표 (CKEditor를 사용하여 SPA 페이지를 다시 표시)를 누르면 CKEditor가 나타나지만 내용이 지워지고 더 이상 반응하지 않습니다. 텍스트 영역을 cliking 할 때 카레트는 없습니다. 또한 setData() 또는 resize()와 같은 모든 API 호출은 더 이상 효과가 없습니다 (주먹 방문시 작동하는 반면).

나는 CKEditor가 (다른 페이지로 전환 할 때 일어나는) DOM에서 제거 될 요소를 좋아하지 않는다고 가정하고 DOM에 다시 추가됩니다 (페이지를 다시 방문 할 때 일어나는 현상).

2017년 7월 5일

당신의 제안이 페이지를 떠날 때 CKEditor를 파괴하는 다시 탐색 할 때 다시 작성하기위한

감사 ON 편집 할 수 있지만 이것을 같은 스크롤 위치로 편집기 상태의 손실 발생, 캐럿 위치, 텍스트 선택 등 ...

이상적으로 나는 편집자에게 뭔가를 쓰는 중간에 다른 페이지를 방문하는 것이 가능하도록하고 싶습니다. 다른 페이지의 내용을 복사 한 다음 바코드를 탐색 할 때 스크롤 바, 캐럿, 선택 항목 등을 변경하지 않음)을 그대로 유지합니다. k를 편집자에게 보냅니다.

가능합니까?

+0

문제를 재현하는 데 도움이되는 [fiddle] (https://jsfiddle.net/ykspc3mo/) – Bruno

+0

[CKeditor 인스턴스를 올바르게 파괴하는 방법] (https://stackoverflow.com/questions/3613215)의 가능한 복제본/how-to-appropriate-destroy-ckeditor-instance) –

+0

감사합니다. Marek하지만 가능한 한 더 나은 해결책을 찾고 있습니다. (내 편집 7 월 5 일 참조) – Bruno

답변

0

당신의 바이올린과 같이 상위 컨테이너를 제거하는 것만으로 CKEditor를 제거하는 것은 좋은 해결책이 아닙니다. CKEditor는 DOM에 일부 수신기를 연결하고 다시 연결되지 않은 리스너를 분리하는 컨테이너를 제거함으로써 좋은 해결책이 아닙니다.

DOM에서 제거하기 전에 편집기를 destroy해야합니다. 그런 다음 다시 작성하십시오. 파괴가 비동기식으로 일어나서 언제 끝 났는지 알면 destroy event을들을 수 있습니다.

여기에 destroy 메서드를 사용하여 fiddle 수정되었습니다 (추가해야 할 destroy 이벤트를 처리하지 않음). 다시이 모든 요소의 상태 편집기를 파괴하기 전에 유지 한 후 설정해야합니다 - 파괴 사이에 2017년 7월 10일

ON

편집 에디터 (스크롤 위치, 텍스트 선택, 등)의 상태를 유지하려면 그것을 다시 만든 후에. 그것은 가능하지만, 약간의 작업과 커스텀 코드가 필요합니다. 이상적으로

나는 그가 편집기에서 뭔가를 작성하는 중간에있는 동안 사용자가 다른 페이지를 방문하는 것이 가능하고 싶다

위를 들면, SPA 응용 프로그램을 만드는 때문에 더 좋은 해결책은 CKEditor가 놓여 있고 이동 중에 페이지의 나머지 부분으로 다시로드되지 않는 부동/고정 컨테이너를 사용하는 것입니다 (예 : Facebook 채팅 작동과 동일).

또한 CKEditor를 다시 만드는 데는 약간의 시간이 걸리지 만 (매우 짧지 만 여전히 표시 될 수 있음) 모든 페이지 탐색시에는 상태가 변경되지 않은 경우에도 편집기에서 어떤 일이 일어나고 있는지 사용자에게 표시됩니다.

+0

고맙지 만 가능한 경우 더 나은 해결책을 찾고 있습니다 (7 월 5 일 수정 참조). – Bruno