자식 태그에서 상위 태그까지의 Riotjs 데이터

Question

나는 비슷한 질문을 많이 보았지만 여전히 어려움을 겪고있다. 시도 - 관찰 할 수 있지만 어딘가 엉망으로 만들었어요. 자식 태그에 여전히

riotjs 할 새로운 나는 목록에 데이터를 밀어하는 기능이 있습니다

이

<make-list> 
...lots of html... 
<script> 
    var piclist = []; --after first function run this list has data 
    .... 
    done: function (e, data) { 
         piclist.push(data.result); 
        } 
    ... 
</script> 
</make-list> 

부모 데이터에 난 기능에 액세스 할

<main> 
...lots of html.. 
<script> 
riot.mount('make-list') 

and i wana use that piclist = []; list here inside a function 

</script> 

</main> 

Answer 1

mixin을 사용하면 이렇게 할 수 있습니다. 어쩌면 올바른 방법이 아니 겠지만 작동합니다.

<main> 
...lots of html.. 
<script> 
riot.mount('make-list') 

var piclist = []; 
riot.mixin(piclist) 


</script> 

</main> 
<make-list> 
    ... lots of html ... 
    <script> 
    ... 
     done: function (e, data) { 
     piclist.push(data.result); 
     } 
    ... 
    </script> 
</make-list> 

Answer 2

그것은 것을 make-list 태그를 사용하여 main 및 make-list으로 표시되는 목록의 목록 항목을 만들려면 main의 하위 항목으로 만듭니다.

상위 태그 내에 riot.mount('make-list')을 사용하고 있습니다. 적어도 매우 드문 경우입니다. 실제로 페이지의 모든 make-list 태그가 탑재되도록 트리거합니다. 왜 폭동과 함께 가지 않고 부모의 HTML 부분에 추가할까요?

<main> 
    ... lots of html ... 
    <make-list opts={piclist} /> 

    <script> 
    this.piclist = []; 
    </script> 
</main> 

선택 항목을 사용하면 하위에 데이터를 전달할 수 있습니다 (이 경우 목록에 대한 참조). 다음과 같이 하위 태그 내에서 액세스 할 수 있습니다.

<make-list> 
    ... lots of html ... 
    <script> 
    ... 
     done: function (e, data) { 
     this.opts.piclist.push(data.result); 
     } 
    ... 
    </script> 
</make-list> 

이 정보가 도움이되기를 바랍니다.

Answer 3

RiotComponent을 살펴보십시오. 직관적 인 방식으로 요소 간 통신을 가능하게합니다.