riot.js 중첩 태그 - jquery로 내부 html 요소를 선택하려면 어떻게해야합니까?

Question

나는 ... 예 중첩 된 태그가 포함 된 폭동 태그가 :

<parent> 
<!-- dome html here...--> 
    <child></child> <!-- visually - the child is mounted correctly !--> 

    <script> 
     this.on('mount', function(){ 
      $('select').material_select(); 
     }); 
    </script> 
</parent> 

<child> 
    <select> 
     <option values="1">1</option> 
     <option values="2">2</option> 
     <option values="3">3</option> 
    </select> 
    <script> 
     this.on('mount', function(){ 
      $('select').material_select(); 
     }); 
    </script> 
</child> 

지금, 나는 목록을 만들기 위해 구체화 라이브러리와 jQuery를 사용하려면를 실현 디자인 http://materializecss.com/forms.html 그것의 등 'select'태그가 상위 태그에있을 때 일반적으로 잘 작동합니다!

그러나 자식에서 $('select').material_select(); 명령을 초기화 할 위치를 찾을 수 없으므로 자식 태그의 select 태그가 보이지 않습니다!.

부모 태그와 자식 태그 모두 on ('mount') 영역에서 초기화하려고했으나 항상 $ ('select') 선택기가 빈 배열을 리턴합니다 - 어떤 아이디어입니까?

Answer 1

DOM을 사용할 준비가되지 않았으므로 자식을 업데이트하고 강제로 자식의 on ('updated') 이벤트를 호출 할 수 있습니다. 이 예제를 확인하십시오.

<parent> 
<!-- dome html here...--> 
    <child></child> <!-- visually - the child is mounted correctly !--> 

    <script> 
     this.on('mount', function(){ 
      this.update(); 
     }); 
    </script> 
</parent> 

<child> 
    <div> 
    <select> 
     <option values="1">1</option> 
     <option values="2">2</option> 
     <option values="3">3</option> 
    </select> 
    </div> 
    <script> 
     this.on('updated', function(){ 
      $('select').material_select(); 
     }); 
    </script> 
</child> 

지금 그것을 처리하고 방법이 정말없는 최적 https://jsfiddle.net/vitomd/Lm4dy21d/5