[Stencil]Web components API

Web components API

Stencil에서 제공하는 전체 API는 데코레이터, 수명 주기 후크 및 렌더링 방법 집합으로 압축될 수 있습니다.

 

데코레이터​

데코레이터는 구성 요소에 대한 모든 메타데이터, 구성 요소가 노출할 수 있는 속성, 특성 및 메서드, 내보낼 수 있는 이벤트 또는 관련 스타일시트를 수집하기 위해 스텐실에서 사용하는 순수한 컴파일러 시간 구성입니다. 모든 메타데이터가 수집되면 모든 데코레이터가 출력에서 ​​제거되므로 런타임 오버헤드가 발생하지 않습니다.

• @Component()는 새로운 웹 구성요소를 선언합니다.
• @Prop()은 노출된 속성/속성을 선언합니다.
• @State()는 구성 요소의 내부 상태를 선언합니다.
• @Watch()는 속성이나 상태가 변경될 때 실행되는 후크를 선언합니다.
• @Element()는 호스트 요소에 대한 참조를 선언합니다.
• @Method()는 노출된 공개 메소드를 선언합니다.
• @Event()는 구성요소가 내보낼 수 있는 DOM 이벤트를 선언합니다.
• @Listen()은 DOM 이벤트를 수신합니다.

Lifecycle hooks​

• connectedCallback()
• disconnectedCallback()
• componentWillLoad()
• componentDidLoad()
• componentShouldUpdate(newValue, oldValue, propName): boolean
• componentWillRender()
• componentDidRender()
• componentWillUpdate()
• componentDidUpdate()
• render()

 

Lifecycle

Using JSX | Stencil