20210505微信开发小程序入门，开发平台介绍、组成

微信开发小程序平台介绍及组成介绍

2021年5月5日，在图书馆学习微信小程序开发，记录入门的几项内容，组成成分及各组成成分的具体作用，希望对读者可以有所帮助，同进步，共勉之！

微信小程序开发平台由json（配置文件）、WXML（模板文件）、WXSS（样式文件）及JS（逻辑文件）4部分组成，现对以上4种文件介绍如下：

一、组成

1、json 配置文件

1）app.json：

①pages 当前小程序页面所有的路径。

②window 所有页面的顶部背景颜色，文字颜色等。

2）project config.json：工具上任何配置都写入这个文件，编辑器颜色 代码上传时自动压缩等。

3）page.json：覆盖app.json 的属性及下拉刷新。

4）json的语法：

①文件包裹在{{ }} 中，key-value 的形式表达，key在双引号中。

　　　　　　 ②数据格式：

　　　　　　　⑴数字： 浮点 、整数

　　　　　　 ⑵数组 ： 在[ ]中

　　　　 ⑶Bool： true、flase

⑷对象 { }

⑸ Null

2、WXML 模板文件

1）标签： ①view ②button ③text

2）{{表达式}} eg:① <text>{{msg}}<text>

3）wx:if

3、WXSS 样式文件

1）尺寸单位： rpx (respone pixel) 1rpx=0.5px=1物理像素

2）引入样式： import "*.wxss"; 分号结束

3）选择器：① 类 .class ② id # ③ element view组件

4）::after 在view 后插入内容 ::before 在view前插入内容

4、js 逻辑交互文件

eg:

WXML层：

<view>{{msg}}</view>

<button bindtap="clickMe">点击我</button>

JS层：

page({

　　　　　　clickMe: function(){

　　　　　　this.setData({msg: "点击我出发点击事件"})

　　　　　　　　　　　　　　}

　　　　　　})