단계별 미니 프로그램: 소개, 텍스트, 이벤트, 스타일

미니 프로그램 소개

미래의 주류가 될 네이티브 APP 또는 웹 APP는 오랫동안 논의되어 왔습니다. 네이티브 APP의 가장 큰 장점은 시스템 제어 인터페이스를 호출할 수 있다는 것입니다. 프레임워크는 Web APP만큼 좋지 않습니다. JD.com은 사용자가 탐색하고 주문할 수 있도록 모바일 앱과 모바일 H5 페이지를 모두 제공하지만 두 가지를 동시에 사용한 사용자는 H5 페이지가 여전히 덜 부드럽다는 것을 알 수 있습니다.
이전에 많은 기업가들이 공개 계정의 메뉴 표시줄에 H5를 삽입하여 WeChat에 기본 기능 이식을 완료했지만 이는 일반적으로 비교적 간단한 페이지이고 운영 경험은 비교적 평균적입니다.
이번에 WeChat이 출시한 미니 프로그램의 가장 큰 특징은 WeChat이 개발자가 호출할 수 있는 인터페이스, 보기, 콘텐츠, 버튼, 탐색, 멀티미디어, 위치, 데이터, 네트워크, 중력 유도 등 이러한 구성 요소와 인터페이스의 도움으로 WeChat에 구축된 미니 프로그램은 실행 기능과 유창성 측면에서 기본 APP와 동일한 경험을 유지할 수 있습니다.
미니 프로그램 등록

미니 프로그램, 구독 계정, 서비스 계정, 기업 계정은 이제 병렬 시스템이므로 사용해야 할 경우 다시 등록해야 합니다.
등록 방법은 공식 문서 설명을 읽어보세요.
WeChat Mini 프로그램 액세스 가이드
개발 도구

공식 문서에서 다운로드하세요:
위챗 미니 프로그램 개발툴 다운로드 주소
자, 개발툴 다운로드가 완료되었으며, 설치 후 바로 인스턴스를 시작하실 수 있습니다.
개발 도구 소개

1. QR 코드를 스캔하여 로그인합니다(먼저 WeChat 애플릿을 등록해야 합니다)

2. 애플릿 프로젝트

3. 프로젝트를 추가하고 여기에서 "APPID 없음"을 클릭하세요.

4.
프로젝트 디렉터리 구조

빠른 시작 프로젝트만 확인하면 자동으로 생성되는 디렉터리입니다.

페이지 폴더 - 모든 페이지 파일이 포함되어 있습니다.

utils 폴더 - 일부 js 도구 세트가 포함되어 있습니다.

app.js - 시작 항목 파일입니다.

app.wxss - 전역 스타일 시트 파일.

app.json - 전역 구성 파일.

.js 접미사는 스크립트 파일이고, .json 접미사는 구성 파일이며, .wxss 접미사는 .css와 유사한 스타일 시트 파일이며, . wxml 구조 파일은 .html
app.json 살펴보기

페이지 프로젝트 할당이 페이지 경로이자 입구임을 알 수 있습니다. 기본적으로 첫 번째 경로가 항목으로 사용됩니다.
pages/index/index, 이 프로젝트에는 .wxml 접미사가 생략되어 있습니다.
각 페이지는 디렉터리를 생성하며, 각 디렉터리에는 기본적으로 4개의 파일이 있습니다.
예

예 1: 텍스트 출력

index.wxml 열기

view는 html의 div와 동일합니다.

이미지는 사진입니다.

텍스트는 텍스트입니다.

텍스트 코드 추가:

효과:

예 2: 텍스트 수정 색상

클래스 추가

더 많은 미니 프로그램 단계별: 소개, 텍스트, 이벤트, 스타일 관련 글은 PHP 중국어 홈페이지를 주목해주세요!