1、小程序开发界面时候需要,界面上接下来需要对接接口数据的地方,尽可能在js那定义好data数据,然后在页面进行绑定,好处自然就是后期对接后台接口数据时候不用大改页面,只用把原先在js页面定义的data数据直接替换即可,不需要更改wxml文件
2、如有页面上有元素是触发跳转的,这时候就要考虑在js页面定义的data数据时候要加上id,作为跳转页面的参数,因为当对接上接口后,通常我们页面跳转都是传参id,然后再通过接口查询详细信息
以上两点主要是说我们在开发页面的尽可能模拟对接上后台的情景,小程序的data数据定义是非常方便我们模拟的,尽可能避免对接口后需要大改页面,这样是十分浪费时间的。
/**
* 页面的初始数据
*/
data: {
modules:
[{
title: "塞尔维斯·多功能房",
hobbyTitle: "life+兴趣定制 | 时光画廊",
id: 1,
{
id:2,
title: "塞尔维斯·多功能房",
hobbyTitle: "life+兴趣定制 | 时光画廊",
}],
},
3、会在多个页面使用到js方法,我们尽量在app.js上封装好,然后在别的页面直接引用即可,这样能减少代码冗余,方便修改,而且多人开发的时候也有效减少重复工作
4、开发过小程序的人都知道小程序官方提供的icon库少得可怜,所以我们是有必要引用第三方icon库的,小程序中icon引用第巴里巴巴图标库的图标,我们在app.wxss粘贴下面代码即可
@font-face {
font-family: 'iconfont'; /* project id 518032 */
src: url('//at.alicdn.com/t/font_518032_t2q88z3jok8iwwmi.eot');
src: url('//at.alicdn.com/t/font_518032_t2q88z3jok8iwwmi.eot?#iefix') format('embedded-opentype'),
url('//at.alicdn.com/t/font_518032_t2q88z3jok8iwwmi.woff') format('woff'),
url('//at.alicdn.com/t/font_518032_t2q88z3jok8iwwmi.ttf') format('truetype'),
url('//at.alicdn.com/t/font_518032_t2q88z3jok8iwwmi.svg#iconfont') format('svg');
}
.iconfont {
font-family:"iconfont" !important;
font-size:60rpx;
font-style:normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/*本项目使用的18个图标 */
.icon-zhiding:before{content: '\e739';}
.icon-zuojiantou:before{content: '\e736';}
.icon-youjiantou:before{content: '\e735';}
.icon-shangjiantou:before{content: '\e734';}
.icon-xiajiantou1:before{content: '\e733';}
.icon-xiajiantou:before{content: '\e6cc';}
.icon-gengduotianchong:before{content: '\e67f';}
.icon-erweima:before{content: '\e65f';}
.icon-fenleiorguangchangorqita:before{content: '\e64f';}
.icon-dibiao:before{content: '\e64d';}
.icon-bangzhu:before{content: '\e64a';}
.icon-xinfeng:before{content: '\e640';}
.icon-duihuaxinxi:before{content: '\e639';}
.icon-sousuo:before{content: '\e62f';}
.icon-shouye:before{content: '\e62d';}
.icon-shezhi:before{content: '\e62a';}
.icon-shanchu:before{content: '\e629';}
.icon-dianhua:before{content: '\e61b';}
页面上使用我们直接使用小程序的icon组件然后在class 上写iconfont 和你想使用的图标的类即可
<icon class="iconfont icon-youjiantou"></icon> //右箭头
5、Now you can provide attr "wx:key" for a "wx:for" to improve performance.这个警告我相信有不少人应该都会碰到过,这个主要是我们在使用wx:for的时候缺少了wx:key这个属性,这个属性我们一般使用一个数组的唯一标识
key的作用:数据改变触发渲染层重新渲染的时候,会校正带有 key 的组件,框架会确保他们被重新排序,而不是重新创建,以确保使组件保持自身的状态,并且提高列表渲染时的效率。
6、关于ajax的post请求后台接受不到数据的问题,主要把请求表头修改为application/x-www-form-urlencoded就行了,这时候请求的数据被编码为名称/值对,当然如果后台支持application/json的参数接受的就不用看这点了
7、小程序要求请求接口必须是https的
8、小程序不能直接进行dom节点操作,ajax请求返回数据之后,赋值data中,之后从data中取数据,进行页面渲染
9、小程序设置分享时候副标题的方法,https://blog.youkuaiyun.com/sqlquan/article/details/81701598
10、小程序使用switchTab跳转后页面不刷新,解决https://blog.youkuaiyun.com/sqlquan/article/details/82466923
但个人建议不要使用刷新,刷新会导致用户体验不好,建议使用页面的onShow事件,每次进入页面都会触发onShow事件可以实现你所需
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
11、小程序的data数据是单向数据绑定,修改data中的数据不会自动更新View;更新view,需要使用setData()方法。setData()更新View时
12、小程序隐藏滚动条:https://blog.youkuaiyun.com/sqlquan/article/details/84139363
以上均为个人见解,如果说错的,请留言指出,欢迎各位大神补充,谢谢