微信小程序开发
微信小程序开发
序言:小程序刚出来的时候,关注度高的无与伦比,但是出来后关注瞬间掉了,因为无法跟原生app相比,也没有更好的推广。或者受环境影响,现在的小程序慢慢的完善,有了一定的需求量了,说这么多废话就是,公司现在要求开发小程序,所以重新关注了一下小程序。今天简单说说几点吧
第一,嵌套h5页面,怎么嵌套呢?
那就简单说说web-view 组件,这是一个可以用来承载网页的容器,会自动铺满整个小程序页面。
类似于Frame、Iframe、Frameset标记,只是对于目前来说,web-view还缺乏灵活性
例如这样
<!-- wxml --> <!-- 指向微信公众平台首页的web-view --> <web-view src="https://mp.weixin.qq.com/"></web-view>
其实两个属性,一个src这个就是你所要链接的h5页面地址,另一个bindmessage,简单意思就是在特定情况是触发并收到消息。
简单介绍下,具体了解可打开https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html
第二微信小程序请求接口
通过wx.request来处理,看下面代码是否很熟悉,跟我们使用的ajax是不是很像,没错,你想的没错微信小程序获取数据就是这么简单。而且后台管理这些都没变。这就不多说了
wx.request({ url: 'test.json',//上线的话必须是https,没有appId的本地请求貌似不受影响 data: {}, method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT // header: {}, // 设置请求的 header success: function(res){ console.log(res.data)
}, fail: function() { // fail }, complete: function() { // complete } })
参考文档https://developers.weixin.qq.com/miniprogram/dev/api/network-request.html#wxrequestobject
后续开发遇到问题也可以相互讨论,毕竟接下来将进入开发环节了。
微信小程序只要去看下微信小程序文档,我觉得对于大家来说都是没啥问题的。
噢,说一个微信跳转传参的小东西
跳转的数据传递
以wx.navigateTo为例:
简单讲述,wx.navigateTo传入的url是跳转的页面(使用相对路径)
wx.navigateTo({ url:"pages/test/test" });
那么参数传递至下一页面,则只需要在路径后面,添加?问号,?后面接的是参数,以key-value的方式。
这里传了个value为1的参数
wx.navigateTo({ url:"pages/test/test?num=1" });
然后在test.js中的onLoad()函数中得到值:option.num就可以得到了,如下:
onLoad: function (option) { this.setData({ type:option.num, }); console.log(option.num); }
这样就可以获取到你传递过来的参数了,然后要怎么开发就怎么开发啦。
嗯,今天聊到这,准备开发工作,下周开始开发、、、、遇到问题再跟大家分享。。