前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >进云原生小程序的开发新手技巧

进云原生小程序的开发新手技巧

作者头像
用户2615381
发布2022-04-16 12:42:44
4340
发布2022-04-16 12:42:44
举报
文章被收录于专栏:进云框架

进云小程序的设计理念,基本跟H5的保持一直,所以小程序的目录结构尽量跟H5的一样(插件的不用加addons,系统的页面在core文件下;例如:jy_weishop/index/目录,对应的就是H5:addons/jy_weishop/index.php),获取数据,提交数据的方法也是跟H5一样的;进云自动生成的小程序源码包,已经按小程序目录生成好了,一般情况下,不用修改目录,另外也内置了所有的基础系统源码在core文件,还内置了jy_weishop源码包。开发者只需优化自己插件的几个页面就行。

小程序会自动识别进云服务器返回的数据:包括,但不限:错误提示语,成功提示,get数据,POST数据等;

1、首先要先去开发中心-生成小程序源码(最好的插件H5程序已经完善的差不多后,再生成小程序源码,这样生成的小程序源码更完善些);

教程移步:http://s.jinyunweb.com/manage/index.php?p=core&action=article.show&nosession=1&id=388

2、进云机制下:小程序源码解读:

【获取页面数据解读】:

代码语言:javascript
复制
app.access是指当前访问页面的地址,是对象形式:{'plugin':'jy_weishop','action':'index','op':'get'}
app.util.get(app.access,function(pagedata){
//console.log('index');console.log(pagedata);
page.setData({
    pluginnav:app.session.menus,//获取的当前小程序插件的底部菜单,必须是标准的,通过插件跟目录下:model/custom_mobile_menu.php文件获取的导航;
    pagedata:pagedata,//尽量保存在pagedata,因为H5读取的数据也是保存在pagedata。这样小程序html页面改动最小
    action:'jy_weishop/index/',//可以知道aciton,如果页面要用到的话
});
});

【页面访问解读】:

下面是一个典型的访问进云页面的写法:

代码语言:javascript
复制
data-func="access" data-params="jy_weishop/goods.detail//id={{item.id}}" bindtap="click"
其中:data-params里面填的是进云标准的短地址,可以缩略方式写,缩略规则跟进云路径规则一直;
注意:这个地址是跟H5地址一样的,所有小程序的目录也必须按照这个地址来,否则会读取不到小程序源文件。
本访问方法:会先读取小程序源文件,如果不存在,就会直接访问H5页面;

【页面POST数据方法】

代码语言:javascript
复制
方法一:js方法
app.util.post('jy_weishop/index/post/',data,function(res){
    consolg.log(res)
});
方法二:单纯提交 //直接在HTML端写
data-func="post"  data-params="jy_weishop/member.cart/offeradd/" bindtap="click"
注意:data-func的值是post的话 ,就是提交数据,比如上面的加入购物车。小程序会根据服务器后台exi('提交成功')。返回提示

【小程序底部导航加载方法】:

代码语言:javascript
复制
<include src="/pages/_menu.wxml"/> //只需在HTML页面底部加上这句,就会读取当前插件的底部菜单

【小程序获取授权方法】:

代码语言:javascript
复制
<include src="/pages/_wxauth.wxml"/> //HTML页面下面加入设个授权页面
下面是会员页面获取授权示例:
onLoad: function (){
		var page=this;
		var ShowAuthM=page.data.ShowAuthM;
		wx.setNavigationBarTitle({'title':page.data.pagetitle});
		app.util.get(app.access,function(pagedata){
			console.log('member');console.log(pagedata);
			if((!pagedata.item.nickname || !pagedata.item.avatar) && !app.isgetUserInfo){
					ShowAuthM=!ShowAuthM
			}
			page.setData({
				pagedata:pagedata,
				ShowAuthM:ShowAuthM,
				pluginnav:app.session.menus,
				action:app.access.plugin+'/'+app.access.action+'/'
			});
		});
	},
	info_login:function(e){
		//根据openid为用户登陆,此处尝试获取用户信息
		var the=this;
		app.util.getUserInfo(e,function(res){
			the.onLoad();
		});
		app.isgetUserInfo=true
		the.setData({
			ShowAuthM:false
		})
	},
要注意赋值ShowAuthM的时机,只要ShowAuthM为true,就会弹出授权窗口

【公众号是站点的依赖】:

站点很多地方依赖了公众号,所以必须添加一个公众号,那怕是跟其他站点,重复的也行,比如默认借用系统的;

小程序本身是不依赖公众号的,没用公众号也能正常运行,只是有些H5页面会依赖到。

本文系转载,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文系转载前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
相关产品与服务
云开发 CloudBase
云开发(Tencent CloudBase,TCB)是腾讯云提供的云原生一体化开发环境和工具平台,为200万+企业和开发者提供高可用、自动弹性扩缩的后端云服务,可用于云端一体化开发多种端应用(小程序、公众号、Web 应用等),避免了应用开发过程中繁琐的服务器搭建及运维,开发者可以专注于业务逻辑的实现,开发门槛更低,效率更高。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档