php可以phpstorm开发小程序序吗

DiyGw是一个基于TwoTHink开源的内容管理框架,由Onethink基础上升级到最新的ThinkPHP5.0.6版本开发,提供更方
便、更安全的WEB应用开发体验,采用了全新的架构设计和命名空间机制,融合了模块化、驱动化和插件化的设计理念于一体,开启了国内WEB应用傻瓜式开发
的新潮流。
源码地址:
DiyGw提供PHP微信小程序解决方案
针对小程序特性,提供了商城跟PHP后台进行交互的解决方案,帮助用户高效完成小程序开发,项目持续更新中...。
感谢以下的作者提供的开源解决方案:
OneThink开源的内容管理框架:
diygw开源的内容管理框架:
ThinkPHP5.0的微信小程序登录流程封装:
微信小程序商城前台:
主要特性:
基于ThinkPHP最新5.0.7版本。
模块化:全新的架构和模块化的开发机制,便于灵活扩展和二次开发。
文档模型/分类体系:通过和文档模型绑定,以及不同的文档类型,不同分类可以实现差异化的功能,轻松实现诸如资讯、下载、讨论和图片等功能。
开源免费:DiyGw遵循Apache2开源协议,免费提供使用。
用户行为:支持自定义用户行为,可以对单个用户或者群体用户的行为进行记录及分享,为您的运营决策提供有效参考数据。
云端部署:通过驱动的方式可以轻松支持平台的部署,让您的网站无缝迁移,内置已经支持SAE和BAE3.0。
云服务支持:即将启动支持云存储、云安全、云过滤和云统计等服务,更多贴心的服务让您的网站更安心。
安全稳健:提供稳健的安全策略,包括备份恢复、容错、防止恶意攻击登录,网页防篡改等多项安全管理功能,保证系统安全,可靠、稳定的运行。
应用仓库:官方应用仓库拥有大量来自第三方插件和应用模块、模板主题,有众多来自开源社区的贡献,让您的网站完美美无缺。
后台主要功能:
用户Passport系统
配置管理系统
权限控制系统
后台建模系统
多级分类系统
用户行为系统
钩子和插件系统
系统日志系统
数据备份和还原
利用DiyGw现有的后台功能和标签库机制,你可以轻松的定制或者开发基于DiyGw的网站和应用。
最低系统需求
PHP 5.4.0 或更高版本。
MySQL 5.0 或更高版本。
域名/public/install.php
非常感谢您的支持!如果您喜欢DiyGw,请将它介绍给自己的朋友,或者帮助他人安装一个DiyGw,又或者写一篇赞扬我们的文章。DiyGw是对
ThinkPHP的传承和新的传奇。由DiyGw 开发团队完成开发。如果您愿意支持我们的工作,欢迎您对DiyGw进行捐赠。
支付宝捐赠(收款人:)
微信捐赠(收款人:html580网站-邓志锋付钱)
如果您对DiyGw有任何建议、想法、评论或发现了bug,请联系我们。
Onethink官网的应用仓库包含了官方和第三方的各类插件,您可以将插件稍作修改即可应用到DiyGw中。
DiyGw基于Apache第二版开源协议发布。
DiyGw官方技术交流群
你还未登录,请选登录!
分享HTML我帮您
收款人:邓志锋 luc***@126.com
收款人:向html580网站(**锋)付钱微信小程序开发初体验--教你开发小程序 - ThinkPHP框架
微信小程序面世以来受到的关注颇多,直到最近我才动手尝试进行了小程序的开发,总体上感觉还是不错的,有一点不适应的就是要摆脱Web APP开发对DOM的操作。在这里我就把我是如何利用API开发微信小程序的过程写成教程,教大家快速上手体验一次微信小程序的开发。
补充: 之前忘了把源码发上来,完成之后就已经放在Github上了 下载:
在开始之前我们先来看下成品的效果图
我们先确定想要开发一款什么样的小程序,首先要符合「小」,因为我们这次是要体验小程序的开发,所以尽量不要弄得太复杂;其次是「快」,小程序里需要的数据啊、资源啊,最好是现成就有的,自己写个API什么的这就太耗时了,就不叫快速上手了。
所以呢,如果能调用现成的API那是极好的,经过一番挑选,我选择了聚合数据的历史上的今天这个API,调用这个API获取数据,我们只要做2个页面就可以完全展示出来了,又「小」又「快」哈XD
API一枚: 历史上的今天API
微信小程序开发者工具:
注: API需要注册之后获得KEY才能使用,具体请查看聚合数据官方文档,这里默认各位已经注册并拥有相应API所需的KEY
微信开发者工具的安装和使用在这里就不多作介绍了,有疑问的话可以看微信官方的简易教程
先创建一个工程,依次点击「添加项目」--「无AppID」,然后填好「项目名称」并选择「项目目录」,点击「添加项目」
然后我们来清理一下默认工程的目录结构,删除以下目录和文件pages/logs/
pages/index/index.wxss创建以下目录和文件pages/detail/&pages/detail/detail.js
pages/detail/detail.wxml
pages/templates/&pages/templates/item.wxml
res/现在你看到的目录结构应该是这样子的.
├──&app.js&├──&app.json&├──&app.wxss&├──&pages&│&&&├──&detail&│&&&│&&&├──&detail.js&│&&&│&&&└──&detail.wxml&│&&&├──&index&│&&&│&&&├──&index.js&│&&&│&&&└──&index.wxml&│&&&└──&templates&│&&&&&&&└──&item.wxml&├──&res&└──&utils&└──&util.js这就是我们工程目录的最终结构了,后面还会添加资源进去,但是整体结构还是这样不会改变的
微信小程序是通过修改app.json文件改变全局配置的,具体的可配置项请各位自行查阅小程序文档的配置一节
打开app.json,修改成{
&&&pages&:[&&pages/index/index&,&&pages/detail/detail&&],
&&&window&:{
&&&&&backgroundTextStyle&:&light&,
&&&&&navigationBarBackgroundColor&:&&#3e3e3e&,
&&&&&navigationBarTitleText&:&&历史今日&,
&&&&&navigationBarTextStyle&:&white&&},
&&&debug&:&true&}我们这里修改了导航栏的背景颜色(navigationBarBackgroundColor)、标题颜色(navigationBarTextstyle)以及标题内容(navigationBartitleText),为了方便查看调试信息,我还开启了debug模式
全局配置以及搞定啦,接下来正式开始编码
前面已经说了我们要做的是「历史上的今天」这样的一个小程序,所以同一个日期会有很多条目,最常见的布局就是做成列表
列表里会有很多的条目,数量是不确定的,所以我们不能在页面里写死了布局,这时候就要用到模板(template)了,我们可以在模板中定义代码片段,然后在不同的地方调用
我们来定义一个模板,打开pages/templates/item.wxml,添加代码&template&name=&tItem&&&&navigator&url=&../detail/detail?id={{item.e_id}}&&&&view&class=&ui-list-item&ui-pure-item&ui-border-b&&&&view&class=&ui-item-span&&&text&{{item.date}}&/text&&/view&&&view&class=&ui-item-content&ui-nowrap&&&text&{{item.title}}&/text&&/view&&&/view&&&/navigator&&&/template&注: 模板的使用细节请参考官方文档模板一节
接下来打开pages/index/index.wxml删掉里面的内容,我们要在这里编写列表页,这里会使用到我们上面定义的模板&import&src=&../templates/item.wxml&/&&&scroll-view&scroll-y=&true&&class=&flex-row&ui-list&ui-border-t&&&&template&is=&tItem&&data=&{{item}}&&wx:for=&{{events}}&/&&&view&class=&ui-tips&&&&view&wx:if=&{{hidden}}&&&text&没有更多内容了&/text&&/view&&&view&wx:else&&text&内容加载中...&/text&&/view&&&/view&&&/scroll-view&&&loading&hidden=&{{hidden}}&&Loading...&/loading&可以注意到第一行使用了import将模板引入到页面中,然后再使用is属性,声明需要使用的模板,用data属性传入数据供模板使用
注: 模板拥有自己的作用域,只能使用data传入的数据
为了测试和查看布局效果,我们打开pages/index/index.js删除里面的代码,然后添加以下代码手动创建数据传入给页面渲染Page({
&&&&hidden:&true,
&&&&events:&[
&&&&&&&&date:&&&,
&&&&&&&&title:&&TodayOnHistory,&历史上的今天&&},
&&&&&&&&date:&&&,
&&&&&&&&title:&&TodayOnHistory,&历史上的今天&&},
&&&&&&&&date:&&&,
&&&&&&&&title:&&TodayOnHistory,&历史上的今天&&},
&&&&&&&&date:&&&,
&&&&&&&&title:&&TodayOnHistory,&历史上的今天&&},
&&&&&&&&date:&&&,
&&&&&&&&title:&&TodayOnHistory,&历史上的今天&&},
&&&&&&&&date:&&&,
&&&&&&&&title:&&TodayOnHistory,&历史上的今天&&}
})保存后点击开发工具左侧的编译,即可查看到效果
注: 布局会用到图标字体,导入到res/下,样式则写在app.wxss全局样式表中,图标字体文件和样式请从源码中获取,这篇教程不作样式的说明
首页的布局已经完成了,暂时放下首页列表,接下来开始编写详细内容的页面
打开pages/detail/detail.wxml,添加内容如下&view&class=&container&&&&view&class=&ui-title&ui-border-b&&&text&{{detail.title}}&/text&&/view&&&view&class=&ui-content&&&text&{{detail.content}}&/text&&/view&&&block&wx:for=&{{detail.picUrl}}&&&&view&&&view&&image&mode=&aspectFit&&src=&{{item.url}}&/&&/view&&&view&class=&ui-pic-title&&&text&{{item.pic_title}}&/text&&/view&&&/view&&&/block&&&/view&&&loading&hidden=&{{hidden}}&&Loading...&/loading&搞定,这个页面就这么简单就OK了,现在我们打开pages/detail/detail.js手动添加数据到这个页面中查看效果Page({
&&&&&&hidden:&true,
&&&&&&detail:&{
&&&&&&&&&&title:&&历史上的今天&,
&&&&&&&&&&content:&&历史上的今天历史上的今天历史上的今天历史上的今天历史上的今天历史上的今天历史上的今天历史上的今天历史上的今天&,
&&&&&&&&&&picUrl:&[
&&&&&&&&&&&&&&{
&&&&&&&&&&&&&&&&&&url:&&http://sjbz.fd.zol-img.com.cn/t_s320x510c/g5/M00/00/04/ChMkJlfJWJCIYePaAAPdCld59MEAAU-KAP0U3gAA90i450.jpg&,
&&&&&&&&&&&&&&&&&&pic_title:&&这是图片标题&&}
&&&&&&&&&&]
现在页面布局都已经完成了,是时候调用API编写逻辑层的代码来填充数据到页面上了,在开始之前我们先清理一下无用的代码
打开app.js删掉无用的函数和属性App({
})以上这步是额外步骤,并不影响我们接下来要做的事情
打开utils/util.js并清空里面的代码,添加如下内容//&查询事件列表的Base&URL&const&API_URL_L&=&&http://v.juhe.cn/todayOnhistory/queryEvent.php&&//&查询详细信息的Base&URL&const&API_URL_D&=&&http://v.juhe.cn/todayOnhistory/queryDetail.php&&//&申请API获得的KEY&const&API_KEY&=&&YOUR&API&KEY&&//&获取事件列表&function&fetchEvents(today)&{&var&promise&=&new&Promise(function(resolve,&reject){
&&&&&&&&wx.request({
&&&&&&&&&&&&url:&API_URL_L,
&&&&&&&&&&&&data:&{
&&&&&&&&&&&&&&&&key:&API_KEY,
&&&&&&&&&&&&&&&&date:&today
&&&&&&&&&&&&},
&&&&&&&&&&&&header:&{&'Content-Type':&'application/json'&},
&&&&&&&&&&&&success:&resolve,
&&&&&&&&&&&&fail:&reject
&&&&&&&&})
&&&&})&return&promise
}&function&getEvents()&{&var&tmpDate&=&new&Date()&var&today&=&tmpDate.getMonth()&+&1&today&=&today&+&'/'&+&tmpDate.getDate()&return&fetchEvents(today)
&&&&&&&&.then(function(res)&{&//&console.log(res.data.result)&return&res.data.result
&&&&&&&&})
&&&&&&&&.catch(function(err)&{&console.log(err)&return&[]
&&&&&&&&})
}&//&获取详细信息&function&fetchDetail(e_id)&{&var&promise&=&new&Promise(function(resolve,&reject){
&&&&&&&&wx.request({
&&&&&&&&&&&&url:&API_URL_D,
&&&&&&&&&&&&data:&{
&&&&&&&&&&&&&&&&key:&API_KEY,
&&&&&&&&&&&&&&&&e_id:&e_id
&&&&&&&&&&&&},
&&&&&&&&&&&&header:&{&'Content-Type':&'application/json'&},
&&&&&&&&&&&&success:&resolve,
&&&&&&&&&&&&fail:&reject
&&&&&&&&})
&&&&})&return&promise
}&function&getDetail(e_id)&{&return&fetchDetail(e_id)
&&&&&&&&.then(function(res)&{&//&console.log(res.data.result)&return&res.data.result
&&&&&&&&})
&&&&&&&&.catch(function(err)&{&console.log(err)&return&[]
&&&&&&&&})
}&module.exports&=&{
&&&&getEvents:&getEvents,
&&&&getDetail:&getDetail
}注: 请将API_KEY的值替换为你申请到的KEY
我们要利用API获取的数据有两种,一是「事件列表」,另一种是事件对应的「详细信息」,上面使用到了ES6原生提供的Promise对象,具体请参考阮一峰的《javascript 标准参考教程(alpha)》中「Promise对象」一节
最后还用到了module.exports对外暴露两个函数,使外部可以调用
我们继续打开pages/index/index.js文件,修改成这样const&util&=&require('../../utils/util.js')
&&&&hidden:&false,
&&&&events:&[]
&&onLoad:function(options){&//&页面初始化&options为页面跳转所带来的参数&var&self&=&this
&&&&util.getEvents().then(function(data)&{&self.setData({
&&&&&&&&hidden:&true,
&&&&&&&&events:&data
})然后打开pages/detail/detail.js,修改如下const&util&=&require('../../utils/util.js')
&&&&&&hidden:&false,
&&&&&&detail:&{}
&&onLoad:function(param){&//&页面初始化&param为页面跳转所带来的参数&var&self&=&this&util.getDetail(param.id).then(function(result){
&&&&&&&&self.setData({
&&&&&&&&&&&&detail:&result[0]
&&&&&&&&})
&&onReady:function(){&//&页面渲染完成&wx.setNavigationBarTitle({
&&&&&&&&title:&this.data.detail.title
&&&&})&this.setData({
&&&&&&&&hidden:&true&})
})这里我们调用了wx.setNavigationBartitle方法动态设置导航栏的标题内容,需要注意的是必须在页面渲染完成之后,即onReady之后才能调用该方法修改导航栏标题
这次教程就到这里结束啦~涉及到的部分知识点并没有详细介绍和说明,如果有不明白的地方请大家根据我给出的链接去查看详细的介绍,此文权当快速上手的一个引子,更加深入的内容以及小程序的其他API的使用,还需要各位亲自去实践,欢迎交流~
ThinkPHP 是一个免费开源的,快速、简单的面向对象的 轻量级PHP开发框架 ,创立于2006年初,遵循Apache2开源协议发布,是为了敏捷WEB应用开发和简化企业应用开发而诞生的。ThinkPHP从诞生以来一直秉承简洁实用的设计原则,在保持出色的性能和至简的代码的同时,也注重易用性。并且拥有众多的原创功能和特性,在社区团队的积极参与下,在易用性、扩展性和性能方面不断优化和改进,已经成长为国内最领先和最具影响力的WEB应用开发框架,众多的典型案例确保可以稳定用于商业以及门户级的开发。thinkphp可以开发微信小程序吗? - ThinkPHP框架
thinkphp可以开发微信小程序吗?
开发微信小程序必须使用腾讯云服务器吗?
积分:1926
ThinkPHP 是一个免费开源的,快速、简单的面向对象的 轻量级PHP开发框架 ,创立于2006年初,遵循Apache2开源协议发布,是为了敏捷WEB应用开发和简化企业应用开发而诞生的。ThinkPHP从诞生以来一直秉承简洁实用的设计原则,在保持出色的性能和至简的代码的同时,也注重易用性。并且拥有众多的原创功能和特性,在社区团队的积极参与下,在易用性、扩展性和性能方面不断优化和改进,已经成长为国内最领先和最具影响力的WEB应用开发框架,众多的典型案例确保可以稳定用于商业以及门户级的开发。博主最新文章
博主热门文章
您举报文章:
举报原因:
原文地址:
原因补充:
(最多只允许输入30个字)

我要回帖

更多关于 php原生开发diy小程序 的文章

 

随机推荐