关于小程序

笔记向文章。欢迎和各位一起讨论。如果文章中有错误请指出。// 例子(小程序)let a = this.data.a;let b = this.data.b;// ES6对象解构赋值let {a,b} = this ; // vuelet {a,b} = this.data; //小程序<viewhidden="{{false}}"></view> <!--false 为显示true为隐藏 -->引用官方的话来说：”一般来说，wx:if 有更高的切换消耗而 hidden 有更高的初始渲染消耗。因此，如果需要频繁切换的情景下，用 hidden 更好，如果在运行时条件不大可能改变则 wx:if 较好。“<!-- 这样的写法会出现换行的效果 --><text>SevenDreamSevenDream </text><!-- 如果不需要换行的效果--><text>SevenDream SevenDream</text><image alt="关于小程序" src="xxx.png" style="display:block"></image>

如果超出最大页面栈处理方法(大于10页) ,将跳转封装。//utils.jsexport function navigateTo(url) {let Type = getCurrentPages().length >= 10 ? 'redirectTo' : 'navigateTo'return new Promise((resolve, reject) => {wx[Type]({url,success: res => {resolve()},fail: err => {reject(err)},})})}// 其他页面jsimport {navigateTo} from '../../utils/utils';navigateTo('pages/index/index')返回上一页时刷新（例如返回个人中心）wx.switchTab({url: '/pages/my/my',success:function(){var page=getCurrentPages().pop(); //当前页面page.onLoad(); // 调用 onload}})在返回上一页时设置上一页的的值var pages = getCurrentPages(); // 获取页面栈var prevPage = pages[pages.length - 2];//上一页prevPage.setData(data);wx.navigateBack({delta: 1})//datadata: {obj: {a: 1},array: ['1']},//改变对象setOBJ:function(){var name = 'a'var obj = 'obj.a'this.setData({[obj]:2})},//改变数组setArr: function () {var num = 0var arr = `array[${num}]`this.setData({[arr]: 2})}如果我们有个表单需要绑定很多bindinput，运用上面的方案,在加上data-*。不需要写很多方法了一个就够了<input data-name="name"bindinput="onInput" value="{{FromOBJ.name}}"><input data-name="phone"bindinput="onInput" value="{{FromOBJ.phone}}"><input data-name="address"bindinput="onInput" value="{{FromOBJ.address}}">// 写入data:{FromOBJ:{name:'',phone:'',address:''}},onInput: function (e) {let name =e.currentTarget.dataset.namelet value = e.detail.valuelet valueObj = `FromOBJ.${name}`;this.setData({[valueObj]:value})}//API.jsconst HTTP_URL = 'https://xxxx.xxx.xxx/'function Request(url, data={},method='get',ContentType='application/json;charset=utf-8') {return new Promise((resolve, reject) => {wx.request({url: HTTP_URL.http + url,method: method,header: {'Content-Type': ContentType,'xxxx': 'xxxx'// 其他header头},data: data,success: function (res) {resolve(res.data)},fail: function (err) {reject(err)}})})}export function getApi(data) {var url = '/getapi';return Request(url, data)}// 其他页面jsimport {getApi} from '../../utils/api';getApi({a:1,b:2}).then(res=>console.log(res)).catch(err=>console.log(err))如果运用到了iconfont，是一次性将文件全部放入的话0一定要把iconfont.js删除。真机的时候会出现报错。白屏无法加载的情况。

制作动画效果时注意 建议用官方的Animation Api 或者css3的animation慎用transition

最后说一个楼主遇到的坑（可能是我的处理方式不对）。在map 组件上的层级不要使用高度变化或者宽度变换的动画过度效果，微信Animation Api和css3 transitionAnimation 属性都会卡桢，卡成ppt。尽量使用他们（微信api，css3）的"transform"来解决问题。

推荐教程：《微信小程序》以上就是关于小程序的详细内容，更多请关注小潘博客其它相关文章！