微信小程序入门2

大家好，欢迎来到IT知识分享网。

微信开发者工具的安装方法

1.打开微信开发者工具下载页面

在微信小程序管理后台的左侧边栏中选择“开发工具”，然后选择“开发者工具”，即可找到微信开发者工具的下载页面。

2.打开微信开发者工具的下载链接页面

单击“下载” 按钮下载，即可跳转到微信开发者工具的下载链接页面。

3.下载微信开发者工具

4.安装微信开发者工具

双击微信开发者工具的安装包，进入微信开发者工具的安装向导。

微信小程序项目的创建方法

1.登录微信开发者工具

2.进入微信小程序的启动页

使用微信扫码登录成功后会进入微信开发者工具的项目选择界面。

,

3.创建微信小程序项目微信开发者工具安装

单击步骤2中图片的“+”可以进入微信小程序项目的创建界面，将内容填写完成后，单击“确定”按钮创建微信小程序项目。

在微信小程序项目的创建界面中，读者可以自定义项目名称和目录，如填写项目名称为“HELLO”，目录为“D:\miniprogram\hello”。关于AppID、开发模式、后端服务和模板选择的具体解释如下。

后端服务：有“微信云开发”和“不使用云服务”两种选择。在“微信云开发”中，开发者无须搭建服务器，即可使用云函数、云数据库、云存储以及微信云托管等完整云端能力。

模板选择：微信开发者工具提供了多种模板用于快速创建微信小程序项目。

微信开发者工具的外观设置

微信开发者工具允许用户对其进行外观设置，包括主题、调试器主题和自定义外观。默认的主题为深色， 如果想设置为其他颜色，更换选项即可。

首先单击微信小程序项目选择界面中的 “ ” 进入设置页面，然后在弹出的设置页面中单击“外观”选项进入外观设置页面，最后在主题下的单选框中选择需要更换的颜色。外观设置页面如下图。

熟悉微信小程序的项目结构，能够解释每个文件的作用

微信小程序项目创建完成后，微信开发者工具会自动创建微信小程序的项目结构，如下图所示。

在微信客户端中启动微信小程序的步骤。

微信小程序的页面组成

一个微信小程序是由一个或多个页面组成的，这些页面被存放在pages目录中。下面以pages目录下的index页面为例展示其组成部分，index页面的组成部分如下图所示。

由上图可知，index页面由4个文件组成，分别是index.js、index.json、index.wxml和index.wxss。

JS：类似网页制作中的JavaScript语言，用于实现页面逻辑和交互，文件扩展名为.js。需要注意的是，微信小程序中的JS不含DOM和BOM，但它提供了丰富的API，可以实现许多特殊的功能，例如微信登录、音频播放、文件上传等。

JSON（JavaScript Object Notation，JavaScript对象符号）：用于利用JSON语法对页面进行配置，文件扩展名为.json。

WXML（WeiXin Markup Language，微信标记语言）：类似于网页制作中的HTML语言，用于构建页面结构，文件扩展名为.wxml。

WXSS（WeiXin Style Sheets，微信样式表）：类似于网页制作中的CSS语言，用于设置页面样式，文件扩展名为.wxss。

微信客户端在加载微信小程序页面时的步骤。

其中，页面中WXSS文件的样式会覆盖项目根目录下的app.wxss 文件中相同的全局样式；页面中JS文件的Page()函数会被调用，用于创建页面实例。