위 챗 애플 릿(응용 번호)구성 요소 상세 설명

이 글 은 주로 위 챗 애플 릿 의 구성 요 소 를 설명 한다.
우선 새 항목 을 설명 합 니 다.3 일 이상 위 챗 애플 릿 개발 을 모집 하 는 것 은 위 챗 을 파 는 엔지니어 밖 에 없 을 것 이라는 말 이 있다.기술 이 새 롭 습 니 다.설명 을 한 이상 건설 프로젝트 에 대한 설명 을 시작 하 겠 습 니 다.

위 그림 과 같이 위 챗 웹 개발 자 도 구 를 엽 니 다.항목 추가 를 누 르 면 새 항목 페이지 가 나타 납 니 다.다음 그림:

그 중 에 AppID 는 마음대로 작성 합 니 다.ps:요구 사항 이 있 을 것 으로 예상 되 는 것 을 본 격 적 으로 개 발 했 습 니 다.항목 이름 을 입력 하고 저장 할 경 로 를 선택 하면 항목 을 추가 하면 ok 입 니 다.
　　　　
이렇게 헬 로 월 드 하나 면 OK.
옛사람 들 은 한 그림 이 천 마디 말 을 이 길 수 있다 고 하 였 는데,모두 직접 그림 을 보면 ok 이다.

자,이제 위 챗 애플 릿 의 구성 요 소 를 설명 하 겠 습 니 다.
공식 유출 데모 파일 부터 부 어 주세요.위 챗 애플 릿 개발 군:390289365 의 공유 파일 에서 다운로드 할 수 있 습 니 다.가 져 온 후 다음 그림 으로 들 어가 기:
　　　　
여기 서 볼 수 있 는 구성 요소 들 을 볼 수 있다.우 리 는 원본 코드 를 열 었 습 니 다.다 중 인터페이스 에 익숙 합 니 다.입구 파일 은 app.js 입 니 다.이것 은 여러 프레임 워 크 와 유사 합 니 다.
　　　　
새로운 것 을 발 견 했 습 니까?아니면 두 개의 새로운 물건?하하wxml 와 wxs 로 끝 나 는 파일 입 니 다.그런데 구체 적 으로 이것 은 어떻게 해석 합 니까?wxml 나 는 w-xml 이 라 고 말 해 야 할 지 wx-xm 라 고 말 해 야 할 지 모르겠다.이 파일 을 열 면 wpf 와 같은 xaml 레이아웃 입 니 다.wxs 는 우리 css 파일 이라도 위 챗 css 일 것 같 습 니 다.이렇게 되면 전단 학생 들 이 익숙 해 지 는 것 이 아 닙 니까?평소에 개발 한 html(wxml),css(css)js(node.js 쓰기 와 비슷 하거나 그 렇 죠)와 같 습 니 다.
구성 요소 가 풍부 한 편 이 라 서 이 편 은 틀림없이 다 소개 할 수 없 을 것 입 니 다.이것 은 먼저 몇 가 지 를 소개 합 니 다.
하나.우 리 는 먼저 demo 의 효과 도,애플 릿 프 리 젠 테 이 션,다섯 글자,이 다섯 글자 의 곳 을 보면 모 바 일 개발,네 비게 이 션 bar 와 유사 하 다 고 할 수 있 습 니 다.이것 은 IOS 개발 과 마찬가지 로 전체적으로 설정 할 수 있 습 니 다.어디 있 지?다음 그림 과 같다.

이 navigation Bar 는 동적 으로 제어 할 수 있 을 것 이 라 고 생각 합 니 다.하지만 api 에서 보지 못 했 습 니 다.후속 공식 문서 에 도 설명 이 있 을 것 입 니 다.
둘.View 요소,이 view 는 react native 와 유사 하 며 html 개발 의 div 와 마찬가지 로 블록 급 입 니 다.그림 의 오른쪽 빨간색 동그라미 와 같은 스타일 을 설정 할 수 있 습 니 다.이렇게 하면 거의 html 의 레이아웃 과 같 습 니 다.css 문법 도 같 습 니 다.view 와 view 는 끼 워 넣 을 수 있 고 div 와 마찬가지 로 margin,padding,display,block,전역＊스타일 등 을 설정 할 수 있 습 니 다.전단 지 파트너 가 이 인터페이스 개발 을 하 는 것 이 부 담 스 럽 지 않다 고 생각 하지 않 습 니까?
　　
셋.navigator 아래 두 그림 은 접 기와 전시 라 고 합 니 다.사실은 navigator 그룹 을 포함 한 view 전시 와 숨 김 을 제어 하 는 것 입 니 다.다음 코드 는 설명 합 니 다.
　　

내용 파 티 션 을 클릭 하고 세 개의 navigator 의 부모 레벨 view 현실 을 클릭 하고 숨 깁 니 다.생각해 보 니 이것 이 html 에 있다 면 이것 은 js 제어 일 것 입 니 다.그러나 위 챗 웹 애플 릿 에서 개발 되 고 있 습 니 다.코드 를 보 세 요.

"js"코드 는 있 지만"click"방법의 연결 은?하지만 뒤 집 힌 데모 코드 에서 도 클릭 의 그림자 가 발견 되 지 않 았 다.사실 여기 서 위 챗 웹 애플 릿 개발 에 내장 되 어 있 는 바 인 딩 방식 을 사 용 했 습 니 다.옅 은 바 인 딩 키 워드 는 click 이 아니 라 bidtap 입 니 다.다음 그림 과 같 습 니 다.
　　
사용 하 는"widgets Toggle"은 위 그림 의"click"이벤트 입 니 다.백 스테이지 type:view Show 를 통 해 프론트 데스크 를 보 여 줍 니 다.
넷.text 이 술 은 html 개발 중인 label 또는 span 과 유사 하 며 작은 조각 급 요소 입 니 다.여 기 는 설명 이 많 지 않 습 니 다.
다섯.navigator,이것 은 우리 페이지 의 점프 를 합 니 다.그 중에서 url 속성 이 가리 키 는 다 중 목표 페이지 를 이동 합 니 다.
여섯.image 이게 img 입 니 다.src 는 html 개발 과 같 습 니 다.
오늘 의 설명 은 여기까지 하 겠 습 니 다.내일 이어서 쓰 겠 습 니 다.내일 은 가능 한 한 일부분 을 소개 한 다음 에 원생 app 의 화면 을 모방 하 겠 습 니 다.