일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- 스위프트
- 계명대
- 자스민
- jest
- data structure
- 이종호
- TDD
- 개발
- 자바스크립트 자료구조
- 개발자
- IOS
- SWIFT
- 자료구조
- 힛잇
- 호키도키
- 계명대 이종호
- javascript
- 스벨트
- hokidoki
- Svelte
- Hitit
- react
- 자바스크립트
- 리액트
- hokeys
- 호키스
- queue
- 리액트 예제
- HTML
- 비동기
- Today
- Total
목록Svelte (13)
Dog foot print
Comment Hello worldHTML에서 사용되는 주석 방식을 컴포넌트 내부에서 사용 가능합니다. 만약 주석이 svelte-ignore와 사용된다면 다음 HTML요소에 관한 경고를 사용 할 수 업게 됩니다. 보통 경고 문구를 해제하기 위해서 사용 되니, 적당한 사유와 동반하여 사용 하시면 됩니다. #svelte
Attributes and props can't touch this 기본적으로 svelte 에서 element에 attribute 를 적용하는 것은 일반 HTML와 동일합니다. HTML에서 attribute에 전달하는 값은 문자열일 필요는 없습니다. page {p} ...attribute value는 javascript 표현식을 사용 할 수 있습니다. 혹은 문자열 보간법을 이용하지 않고, 자바사크립트 표현식을 바로 사용 가능합니다. This div has no title attributeboolean 형식의 attribute는 전달되는 값의 형태에 따라 truthy혹은 falsy로 분류되어 boolean값으로 전달 됩니다. 다른 모든 속성들은 nullish하여, null 혹은 undefined를 ..
태그는 모든 컴포넌트가 인스턴스되었을 때 실행되는 것이 아닌 처음 script를 읽혔을 때 실행 됩니다. 보통의 script태그와 마찬가지로 변수를 선언 가능합니다. context="module" 속성을 가진 script 내부에서 export 키워드를 통하여, 모듈을 방출 할 수 있으며 컴파일 되었을 때, 모듈화 됩니다. export default는 사용 할 수 없습니다. 이유는 해당 파일에서 기본 방출 되는 것은 스벨트 컴포넌트이기 때문입니다. Note : 에서는 반응성을 구현 할 수 없습니다. 만약 다양한 컴포넌트에서 반응성을 필요로 한다면 store를 생성하는 것을 고려하세요 .
Store contract store = { subscribe: (subscription: (value: any) => void) => (() => void), set?: (value: any) => void }개발자는 svelte/store의 도움 없이, store contract를 구현 할 수 있습니다. 다음은 커스텀 스토어를 생성하기 위한 규칙입니다. 스토어는 반드시 subscription 정의에 맞는 첫번째 전달인자를 가진 .subscribe메서드를 가지고 있어야 합니다. subscription콜백은 신속하고 동기적으로 현재 값을 전달해주어야 합니다. .subscribe메서드는 반드시 unsubscribe메서드를 반환해야 합니다. unsubscribe메서드를 호출 하게되면, 더 이상 store의 ..
Svelte script script 블락은 컴포넌트 인스턴스가 생성 되었을 때 실행되는 script 입니다. 변수를 선언하거나 import를 최상위에서 선언한 경우, 해당 컴포넌트 마크업 구조에서 사용이 가능합니다. 이 script에는 4가지 조건이 존재합니다. export creates a component prop svelte는 export예약어를 사용하여, 해당 컴포넌트로 전달되는 props 를 정의합니다. 이렇게 정의된 props는 컴포넌트의 consumer에서 접근이 가능합니다. 또한 개발자는 props의 기본 값을 미리 지정해 줄 수 있습니다. 이 것은 해당 컴포넌트를 사용하는 consumer에서 props를 구체적으로 정의하지 않은 경우, 대신하게 됩니다. props가 consumer에 의..