smalljs$mol검색⌘ K문서플레이그라운드비교에코시스템소개KO
멘탈 모델Getting Started소개멘탈 모델시작하기TypeScript에서 view.tree로프로젝트 구조도구Essentials설치상태와 반응성라우팅렌더링테스트배포문제 해결Data데이터 가져오기데이터 스키마Giper BazaMore쇼케이스React, Vue, Svelte에서쿡북Advanced플러그인모듈 메타데이터오프라인고스트 뷰About자주 묻는 질문릴리스API$mol_button_major$mol_button_minor$mol_string$mol_number$mol_text$mol_paragraph$mol_list$mol_row$mol_link$mol_check$mol_switch$mol_select$mol_scroll$mol_page$mol_pick

멘탈 모델

React나 Vue에서 왔다면, $mol에서의 첫 며칠은 거기 없는 것들을 찾는 데 쓰입니다. computed, watch, useEffect, onMounted, 라이프사이클 훅 안의 fetch. 그것들은 API 어딘가에 숨어 있는 것이 아닙니다. 모델에 그것들이 놓일 자리가 없습니다. 이 페이지는 그 모델의 5분짜리 판본입니다. 보다 먼저 읽고, 익숙한 이름이 보이지 않을 때 다시 돌아오세요.

푸시가 아니라 풀

아무도 읽지 않으면 아무것도 계산되지 않습니다. 뷰는 자신의 속성을 읽으며 렌더링하고, 각 속성은 필요한 것을 읽으며, 의존성 사슬은 그 읽기들로부터 스스로 조립됩니다. 선언할 구독도, 등록할 watch도 없습니다. 읽는 것이 곧 구독입니다.1$my_profile $mol_view2 sub /3 <= Name $mol_view4 sub / <= name \1namespace $.$$ {2 export class $my_profile extends $.$my_profile {3 @ $mol_mem4 user() {5 return this.$.$mol_fetch.json( 'https://api.example.com/me' ) as { name: string }6 }7 name() {8 return this.user().name9 }10 }11}Name을 렌더링하면 name()을 읽고, name()user()를 읽고, user()는 네트워크를 칩니다. 뷰에게 요청에 대해 말해 준 사람도 없고, 요청에게 뷰에 대해 말해 준 사람도 없습니다. user()가 바뀌면 그것을 읽은 모든 것이 다시 계산되고, 그 밖의 것은 아무것도 다시 계산되지 않습니다.

라이프사이클이 없다

mounted도, useEffect도, created도 없습니다. 데이터는 속성을 읽음으로써 요청되고, 뷰는 렌더링할 때 자신의 속성을 읽습니다. 그래서 위의 예제는 $my_profile이 화면에 나타나는 바로 그 순간에 사용자를 불러오고, 그 전에는 불러오지 않습니다. 뷰가 화면을 떠나면 더 이상 아무도 user()를 읽지 않고, 셀은 뷰와 함께 해제됩니다."마운트할 때 fetch" 패턴을 대신하는 것은 이것이 전부입니다. 뷰는 필요한 것을 요청하고, 언제 요청할지는 프레임워크가 정합니다. 로딩은 페이지 이벤트에 붙어 있지 않고, 보인다는 사실에 붙어 있습니다.

속성은 셀이다

선택적 인자 하나를 받는 메서드 하나가 동시에 게터이자 세터이자 계산된 값이자 상태입니다.1@ $mol_mem2count( next?: number ) {3 return next ?? 04}인자 없이 호출하면 읽고, 인자를 주어 호출하면 씁니다. @ $mol_mem은 메서드를, 읽었던 무언가가 바뀌었을 때 다시 계산되는 캐시된 셀로 바꿉니다. 계산된 값이란 다른 메서드를 읽는 @ $mol_mem 메서드일 뿐입니다. 워처는 필요 없습니다. 부수 효과는 이벤트에 속하고, 이벤트 핸들러는 @ $mol_action을 붙인 메서드입니다.1@ $mol_mem2doubled() {3 return this.count() * 24}5 6@ $mol_action7increment() {8 this.count( this.count() + 1 )9}
GitHub에서 이 페이지 편집도움이 되었나요?아니요이전소개다음시작하기
이 페이지에서푸시가 아니라 풀라이프사이클이 없다속성은 셀이다기다리는 동기 코드모든 것은 오버라이드다소스를 읽는 법이름다음
Type to search the documentation.