자바스크립트 for 문 예제

대시보드의 표준 기능을 넘어 UI를 사용자 지정해야 하는 시점에 도달하면 Node-RED의 기본 제공 대시보드 UI보다 훨씬 빠르고 쉽게 작업할 수 있는 경량 프런트 엔드 라이브러리 MoonJS의 사용을 보여 줍니다. 교리스크립트는 자바스크립트로 컴파일되는 프로그래밍 언어입니다. 자바 스크립트는 아름다운 언어이지만, 그것은 꽤 독자 친절하지 않습니다. 고맙게도, Dogescript는 코드가 진정으로 달로 갈 수 있도록 이를 수정합니다. 이제 app.js 내부, 달 자체와 달 라우터를 통합 할 수 있습니다. 나도 알아, 알다시피, 매일 출시 되는 새로운 자바 스크립트 프레임 워크가 있을 것 같다. 달도 그 중 하나입니다. 나는이 튜토리얼은 당신에게 Moon.js와 함께 작업 좋은 시작을 준 바랍니다. 당신이 이것을 즐겼다면, 페이스 북, 트위터 및 링크드 인에서 이것을 공유하면 많은 도움이 될 것입니다. 😊 쉬운 Java 시뮬레이션 모델링 및 작성 도구를 사용하여 달 JS 모델의 단계에 대한 소스 코드를 편집하고 탐색할 수 있습니다.

Moon은 사용자 인터페이스를 구축하기 위한 최소한의 빠른 라이브러리입니다. 구문은 Vue.js와 비슷하지만 6kb에 불과하며 Vue의 결과보다 거의 두 배인 102 다시 그리기 / 초입니다. 이것은 당신이 uibuilder로 무엇을 할 수 있는지의 정말 빠른 데모입니다. MoonJS는 각도 (대시 보드에서 사용), REACT, VueJS 등의 좋아하는 에 대한 경량 대안입니다 그것은 빠르고 사용하기 정말 쉽습니다. 그래서 저는 제가 “달”이라고 부르는 것을 재현하기 시작했습니다. 목표는 Preact처럼하는 것이었지만 Vue의 경우 Vue의 API를 선호했습니다. 여기에 시작 가이드당 간단한 달 인스턴스의 빠른 예입니다 : Moon.js에 대한 아름다운 것들 중 하나는 물론, 구성 요소에 대한 지원입니다. 우리는 달에게 구성 요소를 렌더링할 위치를 알려주었기 때문에 지금 만들면 됩니다. 자바 스크립트 유틸리티의 톤이 출시되는 것을 알고 있지만 일부는 이제 최소한의 측면에 초점을 시작하고 있습니다. 문 대통령은 학습 프로젝트로 시작했다는 것을 기억하십시오.

당시, 나는 단순히 내가 단순히 필요하지 않은 인기있는 라이브러리의 모든 비대 한 기능없이, 자신을 위해 뭔가를 만들기 위해 찾고 있었다. 나는 또한 DOM에 대해 아무것도 몰랐다. 달은 최소한의 API와 빠른 보기 컴파일러와 자바 스크립트 라이브러리입니다. 웹 응용 프로그램을 보기와 데이터라는 두 부분으로 나눕니다. 뷰는 사용자에게 데이터를 표시하는 역할을 하며 데이터 함수로 생각할 수 있습니다. Moon은 데이터가 변경될 때 뷰를 업데이트할 수 있는 4kb 런타임에서 실행되는 JavaScript 프로그램으로 뷰를 컴파일합니다. 데이터는 이벤트를 통해 자신을 업데이트하기 위한 Moon API에 액세스할 수 있는 간단한 개체입니다. JavaScript 개체가 유효한지 확인하기 위해 이전 / 후행 쉼표를 수정하는 것을 잊지 마십시오.

index.html 파일을 완성하려면 Moon이 아직 생성되지 않은 구성 요소를 렌더링할 위치를 알 수 있도록 라우터 뷰를 추가해 보겠습니다. 우리는 그것이 탐색에서 렌더링하기를 원하므로 최종 바디는 다음과 같이 보일 것입니다: 달의 또 다른 멋진 부분은 계산된 속성입니다. 다른 변수가 변경될 때마다 값이 자동으로 업데이트되는 동적 변수로 생각할 수 있습니다. 추가되는 숫자를 변경하면 물론 합계가 정확하고 최신상태이고 계산된 속성이 이를 수행하기를 원할 것입니다. 이전의 두 가지 데이터를 기억하십니까? Moon에서 m-model은 입력 값을 데이터 값과 연결시키는 지시문입니다. 즉, 숫자 입력을 사용하면 문이 자동으로 동기화됩니다. 우리의 홈페이지는 기능적으로 아무것도하지 않습니다. 그것은 단지 우리의 계산기에 대한 다른 페이지를 클릭하라는 메시지를 표시하는 역할을합니다.

이것이 우리가 Moon에게 주는 유일한 것은 구성 요소의 이름, 이 경우 홈 및 렌더링할 템플릿입니다. 그런 다음 Moon은 페이지에 이 번호를 렌더링하고 아름답고 작업하는 계산기가 있습니다.

Share on Google+Share on FacebookTweet about this on Twitter
error: Садржај је заштићен !!