微信小程序开发常用的方法总结（代码）

本篇文章给大家带来的内容是关于微信小程序开发常用的方法总结（代码），有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。

1：wx:for=”{{}}”遍历时，要加wx:key=""否则会有警告提示vm120:3  now you can provide attr “wx:key” for a “wx:for” to improve performance.，但页面不会报错

js:

toDetail:function(e){
 let url = e.currentTarget.dataset.data;
 wx.navigateTo({
 url: #39;../bookdetail/detail #39;
 }

 view >
js:data: {
 // tab切换 
 currentSwiper: 0
 },swiperChange: function (e) {
 this.setData({
 currentSwiper: e.detail.current
},
wxss:/*用来包裹所有的小圆点 */
.dots { 
display: flex; 
justify-content:center; 
flex-direction: row; 
margin:22rpx auto;
/*未选中时的小圆点样式 */
.dot { 
width: 10rpx; 
height: 10rpx; 
border-radius: 50%;
 margin-right: 18rpx; 
 background-color: #969FA9; 
 opacity: 0.5;
/*选中以后的小圆点样式 */
.active { 
width: 20rpx; 
height: 10rpx; 
border-radius:20rpx;background-image: linear-gradient(-90deg, rgba(150,159,169,0.50) 24%, #F5F7FA 100%);
border-radius: 100px;
}
4.微信小程序获取当前页面的url
使用getCurrentPages可以获取当前加载中所有的页面对象的一个数组，数组最后一个就是当前页面
var pages = getCurrentPages() //获取加载的页面
var currentPage = pages[pages.length-1] //获取当前页面的对象
var url = currentPage.route //当前页面url
var options = currentPage.options //如果要获取url中所带的参数可以查看options
可以写成工具函数放到utils中： 
/获取当前页url/ function getCurrentPageUrl(){ 
 var pages = getCurrentPages() //获取加载的页面 
 var currentPage = pages[pages.length-1] //获取当前页面的对象 
 var url = currentPage.route //当前页面url 
 return url }
/获取当前页带参数的url/ function getCurrentPageUrlWithArgs(){ 
 var pages = getCurrentPages() //获取加载的页面 
 var currentPage = pages[pages.length-1] //获取当前页面的对象 
 var url = currentPage.route //当前页面url 
 var options = currentPage.options //如果要获取url中所带的参数可以查看options
//拼接url的参数
var urlWithArgs = url + #39;? #39;
for(var key in options){
 var value = options[key]
 urlWithArgs += key + #39;= #39; + value + #39; #39;
urlWithArgs = urlWithArgs.substring(0, urlWithArgs.length-1)
return urlWithArgs
}
module.exports = { 
 getCurrentPageUrl: getCurrentPageUrl, 
 getCurrentPageUrlWithArgs: getCurrentPageUrlWithArgs }
5.A页面跳转到B页面 标题更新
全局的app.js 中设置参数存放标题 
globalData: { 
 userInfo: null, 
 bookTitle:”” 
 } A页面跳转方法中设置全局的标题参数 app.globalData.bookTitle =”标题”
B页面 onLoad:function(){ 
 wx.setNavigationBarTitle({ 
 title: app.globalData.bookTitle 
 }
6 scroll组件
 scroll-view scroll-y= true bindscrolltoupper= refresh bindscrolltolower= loadMore lower-threshold= 50 bindscroll= scroll 
scroll组件绑定了 bindscroll=”scroll”方法，没定义这个方法时 ，会出现这样的错误提示，但不影响效果，滚动正常，去掉即可
7.微信小程序 —— button按钮去除border边框
在开发微信小程序组件框架时，我遇到了一个问题，微信小程序中的button组件有特定的css，背景可以用“background：none”去掉，但是边框再用“border : none”去掉就不可以了，这也是微信小程序与h5的不同之处。 
但是在微信小程序中使用:after选择器就可以实现这一功能。
使用 button::after{ border: none; } 来去除边框
相关推荐：
微信小程序如何获取用户session_key,openid,unioni（代码） 
小程序如何实现模板消息发送的功能（图文） 
以上就是微信小程序开发常用的方法总结（代码）的详细内容，更多请关注php中文网其它相关文章！
 
  
 微信app下载
 
微信是一款手机通信软件，支持通过手机网络发送语音短信、视频、图片和文字。微信可以单聊及群聊，还能根据地理位置找到附近的人，带给大家全新的移动沟通体验，有需要的小伙伴快来保存下载体验吧！