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: "点击我出发点击事件"})

              }

       })     

     

          

posted @ 2021-05-05 11:06  cx330sky  阅读(82)  评论(0编辑  收藏  举报