동적 스타일을 riotjs 태그에 제공하는 방법

Question

HTML 페이지에서 직접 스타일이나 CSS 클래스를 추가 할 수있는 riotjs 태그를 만들고 싶습니다. 또한 태그 스크립트에서 동적으로 스타일 속성을 설정할 수도 있습니다.

예를 들면;

동적 속성을 사용하여 HTML 태그 문자열을 만들고 루트로 HTML로 삽입하여이 작업을 수행 할 수 있습니다. 하지만 스타일을 지정하기 위해 추가로 하위 태그를 추가하고 싶지는 않습니다.

Answer 1

어때? 태그에 몇 가지 옵션을 전달한 다음 스타일 클래스를 동적으로 변경합니다. 예제를 확인하십시오 http://plnkr.co/edit/ZuPMFFBIuDPSeawsEkPX?p=preview

Answer 2

아래의 구문을 사용하여 요소에 클래스를 선택적으로 포함 할 수 있습니다.

<my-tag> 
    <div class="some-class another-class { my-class: attr1 }"></div> 

<script> 
    this.attr1 = this.opts.attr1; 
</script> 

</my-tag> 

그런 다음 태그를 사용하는 HTML에서. this.opts.attr1가 설정되어있는 경우

<my-tag attr1="whatever"></my-tag> 

그래서, 이것은 <div> 요소에 클래스 my-class을 추가합니다.