微信小程序开发实战（一）开发指南

1. 目录结构

小程序包含一个描述整体程序的 app 和多个描述各自页面的 page。

文件	必须	作用
app.js	是	小程序逻辑
app.json	是	小程序公共配置
app.wxss	否	小程序公共样式表

一个小程序页面由四个文件组成，分别是：

文件类型	必须	作用
js	是	页面逻辑
wxml	是	页面结构
json	否	页面配置
wxss	否	页面样式表

2. app.json 文件介绍

小程序根目录下的 app.json 文件用来对微信小程序进行全局配置，决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。

2.1.自动创建page页面文件

2.2 菜单栏

"tabBar": {"list": [{"pagePath": "pages/index/index","text": "主页","iconPath": "images/tabBar/icon_index.png","selectedIconPath": "images/tabBar/icon_index_selected.png"},{"pagePath": "pages/my/my","text": "我的","iconPath": "images/tabBar/icon_my.png","selectedIconPath": "images/tabBar/icon_my_selected.png"}]
},

2.3 页面配置

每一个小程序页面也可以使用同名 .json 文件来对本页面的窗口表现进行配置，页面中配置项会覆盖app.json 的 window 中相同的配置项。

{"navigationBarBackgroundColor": "#ffffff","navigationBarTextStyle": "black","navigationBarTitleText": "小程序名称","backgroundColor": "#eeeeee","backgroundTextStyle": "light"
}

3 app.js文件

globalData: {url: "http://127.0.0.1/",
},

onLaunch() 函数：默认程序打开后一定执行的功能

4 综合小案例

这里配置两个文件：app.json,index.wxml

4.1 app.json

{"pages": ["pages/index/index","pages/my/my"],"window": {"backgroundColor": "#F6F6F6","backgroundTextStyle": "light","navigationBarBackgroundColor": "#F6F6F6","navigationBarTitleText": "小程序名称","navigationBarTextStyle": "black"},"sitemapLocation": "sitemap.json","style": "v2","tabBar": {"list": [{"pagePath": "pages/index/index","text": "主页","iconPath": "images/tabBar/icon_index.png","selectedIconPath": "images/tabBar/icon_index_selected.png"},{"pagePath": "pages/my/my","text": "我的","iconPath": "images/tabBar/icon_my.png","selectedIconPath": "images/tabBar/icon_my_selected.png"}]}
}

4.2 index.wxml

<view>你真棒
</view>

欢迎加入博主官方QQ群交流: 779133600

微信小程序开发实战（一）开发指南相关推荐

微信小程序入门级实战开发指南
微信小程序入门级实战开发指南概述微信小程序,简称小程序,英文名Mini Program,是一种"不需要下载安装"即可使用的应用(实际上是需要下载安装的,只是整个过程被简化到可以 ...
微信小程序电商项目开发实战漫谈
原创文章,若转载请于明显处标明出处和相关链接:https://www.toutiao.com/i6567868839856439822/,否则追究其法律责任! 2018年小程序内容电商风口已成,如果我 ...
视频教程-微信小程序项目实战之我画你猜视频课程-微信开发
微信小程序项目实战之我画你猜视频课程精通PHP软件开发和WEB前端开发技术,熟悉PHP.Java.Javascript.HTML等语言,熟悉HTTP协议及W3C相关互联网规范,曾在山西某知名公司担任 ...
视频教程-2020最新微信小程序基础+实战精讲视频-微信开发
2020最新微信小程序基础+实战精讲视频负责过多个软件项目的研发.设计和管理工作,拥有项目管理师认证.项目监理师中级认证.出版过的图书有<微信小程序开发图解案例教程><Axure ...
微信小程序高级实战开发培训视频
JEECG社区<微信小程序高级实战开发培训视频> 课程: 微信小程序高级实战开发培训视频讲师: 周俊峰.张加强开课时间: 2016年12月06日开课 * ...
视频教程-微信小程序项目实战：电影购票系统-微信开发
微信小程序项目实战:电影购票系统东北大学计算机专业硕士研究生,欧瑞科技创始人&CEO,曾任国内著名软件公司项目经理,畅销书作者,企业IT内训讲师,CSDN学院专家讲师,制作视频课程超过100 ...
视频教程-微信小程序项目实战：高仿iOS计算器-微信开发
微信小程序项目实战:高仿iOS计算器东北大学计算机专业硕士研究生,欧瑞科技创始人&CEO,曾任国内著名软件公司项目经理,畅销书作者,企业IT内训讲师,CSDN学院专家讲师,制作视频课程超过1 ...
从0到一开发微信小程序（2）——开发第一个小程序
文章目录其他相关文章 1.创建项目 2.小程序代码目录介绍 2.1.描述整体的app.* 2.2.描述各自页面的pages下面的目录其他相关文章从0到一开发微信小程序(1)--申请账号并安装开发 ...
视频教程-微信小程序系统教程python版[3/3阶段]_微信小程序支付-手游开发
微信小程序系统教程python版[3/3阶段]_微信小程序支付微信企业号星级会员.10多年软件从业经历,国家级软件项目负责人,主要从事软件研发.软件企业员工技能培训.已经取得计算机技术与软件资格考试 ...
微信小程序购物商城系统开发系列-工具篇
微信小程序购物商城系统开发系列-工具篇微信小程序开放公测以来,一夜之间在各种技术社区中就火起来啦.对于它估计大家都不陌生了,对于它未来的价值就不再赘述,简单一句话:可以把小程序简单理解为一个新的操 ...