Documents

DocumentsContent

티도리 4.0

티도리 4.0

티도리 4.0 에서는 메인 버전이 상승할 만큼의 변화가 있습니다. 핵심기능 추가로는 스킨 미리보기 제공이 있겠으며 비동기 데이터 를 얻어올 수 있는 API와 조건부 해석, 리스트 렌더링 등의 각종 디렉티브가 추가되었습니다. 그 외에 여러가지 변경사항도 있으니 살펴보시기 바랍니다.

추가 기능

이 절에서 얘기할 내용은 스킨 미리보기, 테스트 케이스 입니다. 스킨 미리보기는 다소 귀찮은 티스토리 스킨 테스트과정을 생략하고 빠르게 테스트할 수도록 도와줍니다. 테스트 케이스 기능은 각종 티도리 API를 템플릿에 직접 작성하지 않고 테스트할 수 있도록 합니다.

스킨 미리보기

스킨 미리보기는 개요에서 말했던 것처럼 귀찮은 과정을 생략하고 빠르게 테스트 할 수 있도록 합니다. 티스토리 치환자 가 해석된 상태로 스킨이 어떻게 보여질지 로컬상에서 확인할 수 있습니다.
* 스킨 미리보기 관련 문서는 스킨 미리보기 부분입니다.

테스트 케이스

테스트 케이스티도리 API 를 템플릿 상이 아닌 테스트환경에서 테스트할 수 있도록 합니다. 디렉티브, 조건부 해석 등을 시험해볼 수 있습니다.
* 테스트 케이스 관련 문서는 테스트 부분입니다.

API

새로 추가 된 API비동기 데이터 를 처리할 수 있는 Async 객체입니다. HTML 이 분리되고 API에 의해 해석되기 이전에 Ajax 등으로 데이터를 가져와 여러 작업을 진행할 수 있습니다.

Async

Async 객체는 비동기 데이터 를 처리하기 위한 객체입니다. fetch 함수를 사용하여 처리할 수 있습니다.
* 비동기 데이터 관련 문서는 비동기 데이터 부분입니다.

디렉티브

디렉티브 부분에서는 많은 것이 추가되었는데, 조건부 해석을 위한 t-if, t-else-if, t-else 디렉티브가 추가되었고, 클래스 바인딩 을 위한 t-class, 마지막으로 리스트 렌더링 을 위한 t-for 디렉티브가 추가되었습니다.

조건부 해석

조건부 해석은 불리언 값에 따라 특정 태그해석 하거나 하지 않을 수 있습니다.
* 조건부 해석 관련 문서는 조건부 해석 부분입니다.

클래스 바인딩

클래스 바인딩은 불리언 값에 따라 클래스바인딩 하거나 하지 않을 수 있습니다.
* 클래스 바인딩 관련 문서는 클래스 바인딩 부분입니다.

리스트 렌더링

리스트 렌더링은 전역변수 와의 협공으로 엘리먼트를 반복하여 렌더링할 수 있습니다.
* 리스트 렌더링 관련 문서는 리스트 렌더링 부분입니다.

변경 사항

몇 가지 변경사항이 있습니다. 함수 APIt-call 디렉티브가 제거되었고, 전역변수 등록과 변경시 값이 아닌 콜백함수 를 받기로 하였으며, 전역변수 를 템플릿에서 사용시 자바스크립트 표현식 을 사용할 수 있습니다. 또한 이벤트 API 에서 파라매터가 있는 이벤트의 파라매터가 변경되었고, 마지막으로 사용자 정의 디렉티브 가 다수의 값을 받을 수 있도록 변경되었습니다.

함수 API 및 디렉티브

함수 API사용자 정의 디렉티브 기능과 기능적으로 하위호환 이라고 볼만한 기능이었으며 특별한 차별점도 없었습니다. 오히려 파라매터도 못받는 그런 기능이었죠. 그렇기 때문에 삭제해버렸습니다.

전역변수 등록과 변경

전역변수 를 등록하는 register 함수와 값을 변경하는 switch 함수가 이제 매개변수를 값이 아닌 콜백함수 를 받습니다. 이렇게 하면 값을 설정하거나 변경할 때 일정 로직을 수행 할 수 있게됩니다.

자바스크립트 표현식

전역변수 를 사용할 때 변수 의 이름과 함께 자바스크립트 표현식 을 사용할 수 있습니다! 이는 리스트 렌더링 에서도 똑같이 적용됩니다.
* 전역변수 관련 문서는 전역 변수 부분입니다.

이벤트 파라매터

beforeHTMLProcessing, afterHTMLProcessing 이벤트의 콜백함수가 받는 파라매터가 HTML 문자열 이 아닌, HTML 문서 객체로 변경되었습니다. jQuery API 를 사용하여 변경하고 수정할 수 있습니다.
* 이벤트 관련 문서는 이벤트 부분입니다.

사용자 정의 디렉티브 파라매터

사용자 정의 디렉티브 는 본래 값을 한 가지만 받을 수 있었지만, 이제는 여러가지 값을 배열 형태로 받을 수 있습니다.
* 사용자 정의 디렉티브 관련 문서는 사용자 정의 디렉티브 부분입니다.