2017-09-20 4 views
0

현재 내 사이트에 표시하려는 모든 테이블에 몇 가지 기본 기능을 제공하는 일반 테이블 구성 요소를 작성하고 있습니다. 그런 다음 실제 테이블 각각은이 일반 테이블을 사용하여 헤더와 내용을 일반 테이블에 제공합니다.Riot JS 여전히 테이블을 올바르게 렌더링하지 않았습니다.

Riot JS의 최신 버전은 작성 당시 - 테이블에 내용을 저장할 때 여전히 문제가있는 것처럼 보입니다. 보다 구체적으로 말하자면, Riot은이 정보를 기본 태그 (trtd 태그 제외)에 넣지 만 실제 테이블은 비워 둡니다.

https://jsfiddle.net/ytgv5o5k/1/

오는 수정 또는 내가 지금 사용할 수있는 해결 방법이 있습니까? 일부 소스는 data-is 한정자를 언급하지만 일반적인 테이블 구성 요소를 다시 사용하려면이 방법을 사용하지 않습니다.

고맙습니다.

답변

0

이것은 사용자 정의 html 태그를 사용하는 프레임 워크를 사용할 때 주요 문제점입니다. 실제로 폭동과는 아무런 관련이 없습니다. 당신이하려는 것은 유효한 html이 아니기 때문에, 브라우저는 유효하지 않은 태그를 테이블 밖으로 내쫓습니다.

는 여기를 참조하십시오 : http://riotjs.com/guide/#riot-dom-caveats

은 별도의 태그에 테이블을 깰 응용 프로그램에서 의미가있는 경우,이처럼 처리 할 수 ​​있어야합니다 :

<table-container> 
    <table> 
     <tr data-is='table-row' each={ row in rows } row={ row }></tr> 
    </table> 
</table-container> 

하는 당신은 할 수 없습니다 yield 유효한 HTML이 아닌 테이블에 무엇이든. 내가 아는 한, 폭동에는 HTML을 DOM에 배치하기 전에 html을 처리하는 개념이 없습니다. 이는 태그가 table 밖으로 이동 될 때입니다. <yield/>을 사용할 수있는 유일한 방법은 콘텐츠를 셀에 배치하는 것입니다.

<td> 
    <yield/> 
</td>