小程序开发

原创 nyy3723 随笔 小程序 182阅读 29 天前 举报

记一次小程序开发

之前也都是自己看过一点小程序的开发文档,据说是跟vue差不多,但是没有真正的实践用过。这一次也是完整的从0到1的小项目开发,打个笔记来记录自己踩过的坑。

1、wx.request()相关

wx.request()发起网络请求,每次请求的时候sessionid值都会发生改变,之前做首页登陆时候,由于第一次登陆需要提交手机号获取验证码,但是就是由于每次的请求都改变的sessionid值会改变,导致多次登陆不成功,之后查了很久才知道是这个问题,一般使用wx.request()时候也都会封装成一个函数来调用,解决sessionid不一致的方法就是:

1>.封装函数request函数时,封装header里面加入cookie部分,

2>.第一次调用的时候,将后台返回的sessionid保存在缓存中,之后每次发送请求都从缓存中取到sessionid值,一起传给后台

注意在小程序中,所有请求必须是https


2、form表单相关

说起表单,肯定就有表单值的提交以及回显值的功能,虽然小程序在表单提交时,还是可以人性化的得到所有表单元素的name及对应的值,但是在回显值的还是不是很方便,用习惯了vue,表单的数据双向绑定怎么能少?

1>.实现表单数据双向绑定:

我实现数据绑定的方法就是在input中绑定input事件,表单的input事件只要表单值改变就会触发,具体使用:

上面代码中data-key是很关键的,其实就是相当于input的name值,每次input改变值时,this.setData都会在data中找到userid重新赋值。

1>.数据的回显(关于下拉框的坑):
数据回显一般用编辑中用的很多,比如页面加载时后台返回的一些个人信息,姓名职位等,这时候就要在表单中展示出来,一般表单用上述数据绑定 改变 data中的 key值就可以搞定,但是下拉框可以有点麻烦,小程序中使用下拉框是picker组件,每次选择后得到的对应value是选择项的index值,但是一般情况下下标是用不上的,比如后台返回的职位列表 positionidlist: [{ did: 10,position: '前端开发'},{did: 15,position: 'java开发'},{did: 20,position: 'php开发'}],educatelist: [{ did: 100,val: '大专'},{did: 150,val: '本科'},这个时候需要的did值,需要显示的是position值,那页面该怎么办?

首先在通过picker中 range-key 显示position值

positionid是下标,这样选择的岗位返回值是对应的下标而不是对应的did

接下来通过返回的下标找到对应的positionlist数组数组对象通过 positionlist[i].did来获取即可。

如果要同时绑定多个下拉框事件,当返回的下拉列表里面的字段一致时,可以考虑一下做法:




将返回的列表统一名字为name值+list ,弄成一致,并把id值和保存下拉框的index的变量值也跟name一致,这样可以通过获取id来获取当前列表,再通过对象的方式修改对应的值,并且取到对应的did

如果后台返回多个下拉框对应的值,页面盖如何选中,比如后台返回岗位did为20,学历did为150,则页面需要默认选中php开发和本科。处理方式:

后续再加……

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复