2016-07-14 2 views
2

Redux를 사용하여 Riot 앱 상태를 관리하려고했지만 모델에서 변경된 사항 (간단한 항목 배열)이 컬렉션에서 렌더링 된 모든 요소가 다시 변경 사항이 하나의 항목과 관련된 경우에도 렌더링됩니다. 아무 문제가없는 가변 감속기와 Riot.JS : 불변의 데이터 구조로 인해 원치 않는 렌더링이 발생합니다

I reproduced the issue here

는 두 경우 모두에서 나는 (가변 데이터를 불필요)보기 업데이트를 트리거 가게의 변화를 볼.
this.on('mount',() => { 
    opts.store.subscribe(() => { 
    this.update({ 
     items: opts.store.getState() 
    }) 
    }) 
}) 

gif demonstrating that DOM of my list is completely re-rendered

나는

내가 뭘 잘못 했나 ... 오직 DOM의 변경된 부분을 다시 렌더링 폭동의 가상 DOM 검사를 생각?

답변

1

루프에 no-reorder을 추가

<li no-reorder each={ items } onclick={ toggle }> 
    <span>{x}</span> 
</li> 
+0

완벽하게 작동하는 것 같다, 그 일을 어떤 제한이 있습니까? – Freez

+0

@Freez 불행히도, 나는 모른다. – pongo

+0

"riot v2.3에서는 루프를 더욱 안정적으로 렌더링하기 위해 DOM 노드가 데이터 컬렉션과 항상 동기화되어 이동, 삽입 및 제거됩니다.이 전략을 사용하면 이전 2.2 릴리스와 비교하여 렌더링 속도가 느려집니다. 렌더링 알고리즘을 사용하면 루프 노드에 no-reorder 속성을 추가 할 수 있습니다. " http://riotjs.com/guide/에서 –