• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

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

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

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

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

              }

       })     

     

          


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
微信小程序-关于post请求传递list集合发布时间:2022-07-18
下一篇:
微信小程序开发者工具扫码成功但是进不去发布时间:2022-07-18
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap