系统分析与设计_lesson5

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/A657997301/article/details/79954673

微信小程序入门

准备

  • 微信公众平台使用没有绑定过微信公众号和微信个人号的邮箱注册。

  • 下载微信开发者工具。(安装:下一步→我接受→安装→完成)

创建项目

这里写图片描述

点“小程序项目”

这里写图片描述

这里“项目目录”和”项目名称“自定,APPID要填微信公众号里的(不填也可以,不过部分功能会受限)

这里写图片描述

你就会得到一个HELLO WORLD的小程序

这里写图片描述

分析文件

这里写图片描述

从整体来看,小程序遵循的是MVC模式,小程序分为视图层View和逻辑层AppService的两层框架,并在视图层和逻辑层之间提供数据传输和事件系统。

  • app.js,它主要是放置一些程序的全局变量、属性或方法以及执行程序的一些生命周期,比如onLaunch(),onShow(),onHide()。当程序一启动的时候就会执行onLaunch()方法,当页面显示的时候执行onShow()方法,当界面隐藏或转换到后台的时候执行onHide()方法。

  • app.jsonpages配置所有页面的路径,在window对象里面配置window的样式,在tabBar设置底部tab的样式,在networkTimeOut对象里面配置一些全局超时变量,通过debug赋值是否开启调试模式。

  • app.wxss 相当于css文件,全局样式,在所有页面都可以调用。

  • index.js 第一个页面的逻辑层,包括一些事件处理函数,还有一个onLoad()方法,当页面加载完后会执行。

  • index.json 可以覆盖一些窗口navigationBar的一些属性。

  • index.wxml 页面的视图布局文件,相当于Androidxml布局。其中里面的view相当于div,其中bindtap属性指的是点击事件,然后对应的点击事件在index.js里面处理。

  • index.wxss首页的一些样式,供index.wxml的根节点属性使用。

在创建一个页面的时候,其中xxx.jsxxx.wxml是必须的文件,其他的文件是非必须的。

开发教程文档

预览

可以在微信开发工具中进行预览,也可以到手机上预览

这里写图片描述

猜你喜欢

转载自blog.csdn.net/A657997301/article/details/79954673
今日推荐