微信小程序开发常见坑

前段时间稍微涉猎了微信小程序开发,踩了一些坑,在此总结出来,但愿能为小伙伴们提供一点帮助。

页面跳转

对于页面跳转,可能习惯性想到wx.navigateTo,可是在跳转到目标页面是一个tab时,此接口就不起做用了,但也不会报出任何错误。此时应使用wx.switchTab,详见连接描述html

区分几种导航接口:
wx.navigateTo是保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack能够返回到原页面。wx.redirectTo关闭当前页面,跳转到应用内的某个页面。wx.reLaunch关闭全部页面,打开到应用内的某个页面。小程序

switchTab后tab不刷新

场景:不一样帐号有不一样权限,首页展现不一样模块,在退出帐号一改用帐号二登录后,首页展现的模块与帐号二的权限不一致。
问题分析:登录页面是在首页基础上新开了一个页面,在登录成功后调用switchTab跳转到首页,看起来并无任何问题。关键在于switchTab跳转后并不刷新页面,
,因此用帐号二从新登录后到达的首页还是帐号一的首页。因此须要用下面的方法来刷新登录后的页面:segmentfault

wx.switchTab({
    url: '/pages/xx/index',
    success: function (e) {  
      let page = getCurrentPages().pop()
      if (page == undefined || page == null) return
      page.onLoad()
    }
})

text-align:justify不起做用

在涉及文本两端对齐时,理所固然的想到使用text-align:justify,但发现不起做用,经查询,发现MDN上是这么写的:微信小程序

justify
The inline contents are justified. Text should be spaced to line up its left and right edges to the left and right edges of the line box, except for the last line.

也就是说,text-align:justify只对非最后一行起做用,只有一行文本时也算最后一行,对,就是这么坑。固然这不单单是对于微信小程序而言。
因而找到text-align-last:justifyapi

The text-align-last CSS property describes how the last line of a block or a line, right before a forced line break, is aligned.

微信开发环境上试试看,谢天谢地,搞定!可是,图样图森破,微信一扫,仍是依旧。哦到开,text-align-last有兼容性问题。微信

看来仍是得看text-align,它是针对非最后一行的,那么咱们能够尝试把一行文本假装成非最后一行,好比经过添加一个空内联块状元素或者使用伪元素。可参考连接描述微信开发