当前位置： 小程序demo源码下载-微信小程序官方demo
//logs.js var util = require('../../utils/util.js')
页（{
数据： {
日志：[]
},
onLoad: 函数 () { 这个。 设置数据（{
日志：(wx.getStorageSync('logs') || []).map(function (log) { return util.formatTime(new Date(log))
})
})
}
})
运行结果如下：
4.手机预览
在开发者工具左侧菜单栏选择“项目”，点击“预览”，在微信客户端扫码体验。
目前还没有预览和上传功能，需要等待官方微信下次更新。
可以看到，官方的微信开发指南还是很简单的，很多细节、代码、功能都没有展示清楚，是时候展示一下实力了！ 开发教程正式开始！
第一章：准备工作
做好功课很重要。 开发微信应用号需要提前到微信官网（weixin.qq.com）下载开发者工具。
1、下载最新的微信开发者工具，打开后会看到这个界面：
2. 点击“New web+”项，会出现如下画面：
3.本页内容需要注意——
AppID：按照官方说明填写。
Appname：项目最外层文件夹名称。 如果将其命名为“ABC”，则所有后续工程内容都将保存在“/ABC/...”目录中。
本地开发目录：本地存放项目的目录。
注意：再次提醒，如果您和您的团队成员共同开发项目，建议您使用相同的目录名和本地目录，以保证协同开发的统一性。 如果您之前已有项目，导入过程与上述内容类似，此处不再赘述。
4、所有准备工作完成后，点击“新建项目”按钮，在弹出的框中点击“确定”。
5. 如上图所示，此时微信开发者工具已经自动为您构建了一个初始demo工程，其中包含了微信应用工程所需的基本内容和框架结构。 点击项目名称（图中“卡片”）进入项目，可以看到整个项目的基本结构：
第 2 章：项目架构
微信目前拥有非常庞大的用户群。 微信推出公众号后，大家的火爆程度可见一斑，同时也促进了Html 5的快速发展。随着公众号的业务需求越来越复杂，应用号的到来恰到好处。
我们发现微信提供给开发者的方式也在发生着全面的变化：从操作DOM到操作数据，基于微信提供的一个桥接工具，实现了很多在公众号Html 5中难以实现的功能，这有点类似于混合开发，不同于混合开发的方式：微信开放的接口比较严谨，结构必须采用它提供的组件，这里不能使用外部框架和插件，让开发者可以彻底脱离操作DOM，对他们的开发思路改变很大。
工欲善其事，必先利其器。 了解它的核心功能很重要小程序demo源码下载，首先要了解它的整个运行过程。
生命周期：
在 index.js 中：
在开发者工具的控制台可以看到：
在首页的控制台上可以看到顺序是App Launch--App Show--onLoad--onShow--onReady。
首先是整个app的启动和显示。 App的启动可以在app.js中配置，然后进入各个页面的加载显示等。
可以想象这里可以处理很多东西，比如装箱子之类的都可以实现等等。
路由：
路由一直是项目开发的核心点。 其实微信这里对路由的介绍很少。 可见微信在路由方面封装的很好，也提供了三种跳转方式。
wx.navigateTo(OBJECT)：保持当前页面，跳转到应用中的某个页面，使用wx.navigateBack返回原页面。
wx.redirectTo(OBJECT)：关闭当前页面，跳转到应用中的某个页面。
wx.navigateBack()：关闭当前页面，返回上一页。
这三个基本够用了。 在路由方面，微信封装的很好。 开发者根本不需要配置路由。 通常，许多框架中的路由配置非常繁琐。
成分：
这次微信在组件提供方面也非常全面，基本满足了项目的需求，所以开发速度非常快。 开发前可以仔细浏览几次，开发效率会很好。
其他：
任何外部框架和插件基本无法使用，甚至原生的js插件也很难使用，因为之前的js插件基本都是以dom操作的形式存在，而微信应用号的架构不允许任何操作dom，连开发者以前习惯用的动态设置rem.js也不支持。
这次微信还提供了WebSocket小程序demo源码下载，可以直接用来聊天，还有很大的发展空间。
与公众号相比，发现开发应用号组件化、结构化、多元化。 新世界总是充满惊喜，更多彩蛋等你来发现。
让我们从一些简单的代码开始吧！
1. 找到项目文件夹并将其导入到您的编辑器中。 在这里，我们使用了 Sublime Text 编辑器。 大家可以根据自己的开发习惯选择自己喜欢的编辑器。
2、接下来需要根据自己的项目内容调整项目结构。 在示例工程中，“card_course”目录主要包含“tabBar”页面和应用程序的一些配置文件。
3、示例项目的“tabBar”是五个菜单按钮：
4.找到“app.json”文件配置五个菜单。 在代码行中找到“tabBar”：
可以根据实际项目需求进行更改，其中：
"Color"为底部的字体颜色，"selectedColor"为切换到该页面时的高亮颜色，"borderStyle"为切换菜单上方一行的颜色，"backgroundColor"为底部菜单的背景色酒吧。 文字描述比较抽象。 建议大家逐一调试查看效果，加深印象。
“列表”下的代码顺序必须按顺序放置，不能随便更改。
在“pagePath”之后的文件名中，隐藏了“.wxml”后缀。 这是微信开发代码中的一个人性化点——帮你节省写代码的时间，也不需要频繁声明文件后缀。
“iconPath”为未显示页面的图标路径，这两个路径可以直接为网络图标。
“selectedIconPath”是当前显示页面中高亮图标的路径，可以去掉。 移除后默认显示为“iconPath”的图标。
“文本”是页面的标题，也可以去掉。 移除后，只会显示图标。 如果只删除其中一个，则该位置将被占用。
注意：微信底部菜单最多支持五栏（五个图标），所以在设计微信应用的UI和基础架构时，一定要提前考虑好菜单栏的布局。
5、根据以上代码规则，我们准备了示例工程的基本结构供大家参考：
6、“Json”文件配置完成后，“card_course”的基本结构如上图所示。 不需要的子集可以暂时删除，缺失的子集需要自己主动创建。 删除子集时，记得检查“app.json”中的相关内容是否一并删除。
注意：我个人建议大家新建一个“wxml”文件，同时创建对应的“js”和“wxss”文件，因为微信小程序账号的配置特点是解析一个“wxml”文件时，会同时创建。 在上级目录下发现“js”和“wxss”文件同名，所以要及时在“app.json”中预先配置“js”文件。
编写“wxml”时，可以根据微信应用号提供的接口进行编码。 大部分都是以前的“div”，现在可以用“view”了。 当需要使用其他子集时，可根据微信提供的接口进行选择。
使用“class”名来设置样式，“id”名在这里基本没用。 主要操作数据，不操作“dom”。
7、以上是示例工程首页的“wxml”代码。 从图中可以看出，实现一个页面的代码量很小。
8、“wxss”文件是导入的样式文件，也可以直接在里面写样式。 示例中使用了 import 方法：
9、修改代码后刷新一次，可以看到没有背景的“view”标签直接变成粉色了。
注意：修改“wxml”和“wxss”下的内容后，F5刷新可以直接看到效果。 如果修改“js”，需要点击重启按钮才能看到效果。
10.另外，在“app.wxss”中可以直接引用公共样式。
11、需要在“app.json”文件的“页面”中预先配置“Js”文件。 为了理清项目结构，在示例项目中“index”主页的同级目录下创建另外四个页面文件，如下：
经过以上步骤，机箱底部的五个菜单就全部配置好了。
想要入门，首先要掌握js、html、css的知识。
那么大家可以通过查看微信公众平台的微信小程序开发教程，对微信小程序的开发调试方法有一个大概的了解。 官方介绍比较简单易懂。
另外，大家可以通过入门贴了解具体的开发过程。
以上~~
希望能给你一些帮助，望采纳·
如何找到微信小程序Demo的源码？ 我在哪里可以下载它？
微信小程序的demo源码有很多种。 我一般都是在即时应用bbs小程序开发论坛上找小程序的demo源码。 里面的资源基本可以满足各个开发组的需求。 并且可以直接下载。
求一个最简单的微信小程序源码
如果要带背景，一般不容易带背景。 也有这样的配额，价格会高一些。
简单微信小程序开发案例源码介绍和微信小程序开源源码介绍到此结束。 不知您是否从中找到了您所需要的信息？ 如果你想了解更多这方面的信息，记得收藏并关注本站。
简单的微信小程序开发案例源码
上一篇 
