這篇文章帶給大家的內容是關於微信小程式開發常用的方法總結（程式碼），有一定的參考價值，有需要的朋友可以參考一下，希望對你有幫助。
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: '../bookdetail/detail'
});
}<view class="wrap">
<swiper class="swiper_book_img" current="{{currentSwiper}}" bindchange="swiperChange">
<block wx:for="{{banner}}" wx:key="unique">
<swiper-item class="slide_img">
<image src="{{item.picUrl}}" class="slide-image" width="100%" height="110" ></image>
</swiper-item>
</block>
</swiper>
<!--重置小圆点的样式 -->
<view class="dots">
<block wx:for="{{banner}}" wx:key="unique">
<view class="dot{{index == currentSwiper ? ' active' : ''}}" id="{{index}}"></view>
</block>
</view>
</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;
}#使用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 + '?'
for(var key in options){
var value = options[key]
urlWithArgs += key + '=' + value + '&'
}
urlWithArgs = urlWithArgs.substring(0, urlWithArgs.length-1)
return urlWithArgs}
module.exports = {
getCurrentPageUrl: getCurrentPageUrl,
getCurrentPageUrlWithArgs: getCurrentPageUrlWithArgs }全域的app.js 中設定參數存放標題
globalData: {
userInfo: null,
bookTitle:””
} A页面跳转方法中设置全局的标题参数 app.globalData.bookTitle =”标题”
B页面 onLoad:function(){
wx.setNavigationBarTitle({
title: app.globalData.bookTitle
})
}
<scroll-view scroll-y="true" bindscrolltoupper="refresh" bindscrolltolower="loadMore" lower-threshold="50" bindscroll="scroll">
scroll元件綁定了bindscroll=”scroll”方法，沒定義這個方法時，會出現這樣的錯誤提示，但不影響效果，滾動正常，去掉即可
在開發微信小程式元件框架時，我遇到了一個問題，微信小程式中的button元件有特定的css，背景可以用「background：none」去掉，但是邊框再用「border : none」去掉就不行了，這也是微信小程式與h5的不同之處。
但是在微信小程式中使用:after選擇器就可以實現這項功能。
使用button::after{ border: none; } 來移除邊框
相關推薦：
微信小程式如何取得使用者session_key,openid,unioni（程式碼）
以上是微信小程式開發常用的方法總結（程式碼）的詳細內容。更多資訊請關注PHP中文網其他相關文章！
