1.自动拨打电话
bindtap='onTap'
onTap: function (event) {
wx.switchTab({
url: '../user/user',
});
},
2.自动调用用户地址
<view bindtap='chooseAddress'>1111111</view>
//用户选择收货地址
chooseAddress: function () {
var that = this;
if (wx.chooseAddress) {
wx.chooseAddress({
success: function (res) {
console.log(JSON.stringify(res));
console.log(res);
that.setData({
"add_userName": res.userName,
"add_telNumber": res.telNumber,
"add_provinceName": res.provinceName,
"add_cityName": res.cityName,
"add_countyName": res.countyName,
"add_detailInfo": res.detailInfo,
"add_postalCode": res.postalCode,
//具体收货地址显示
flag: false,
})
},
fail: function (err) {
console.log(JSON.stringify(err));
console.info("收货地址授权失败");
wx.showToast({
title: '授权失败，您将无法进行下单支付;重新授权请删除小程序后再次进入',
icon: 'success',
duration: 20000
})
}
})
} else {
console.log('当前微信版本不支持chooseAddress');
}
},
3.实现与微信客服聊天
<button class="kf_button" open-type="contact" session-from="weapp"></button>
4.选项卡
<view class="swiper-tab">
<view class="swiper-tab-item {{currentTab==0 ? 'on' : ''}}" data-current="0" bindtap="swichNav">综合<view></view></view>
<view class="swiper-tab-item {{currentTab==1 ? 'on' : ''}}" data-current="1" bindtap="swichNav">销量<view></view></view>
<view class="swiper-tab-item {{currentTab==2 ? 'on' : ''}}" data-current="2" bindtap="swichNav">价格<view></view></view>
</view>
// tab切换
currentTab: 0,
swichNav: function (e) {
var that = this;
if (this.data.currentTab === e.target.dataset.current) {
return false;
} else {
that.setData({
currentTab: e.target.dataset.current,
})
}
},
5.设置图片宽度是最多 高度自适应
<image src="http://pic.youlife.me/v1/tfs/T1yt_TBC_T1RXrhCrK.jpg" class="slide-image" mode="widthFix"/>
data: {
winWidth: 0,
winHeight: 0,
}
onLoad: function () {
var that = this;
wx.getSystemInfo({
success: function (res) {
that.setData({
winWidth: res.windowWidth,
winHeight: res.windowHeight
});
}
});
},
6.显示图片的大图
<view wx:for="{{imgalist}}"wx:for-item="image"class="previewimg">
<image src="{{image}}" data-src="{{image}}" bindtap="previewImage" class='img'></image>
</view>
data: {
imgalist: ['https://www.cslpyx.com/weiH5/jrx.jpg', 'https://www.cslpyx.com/weiH5/mmd.jpg'],
},
previewImage: function (e) {
wx.previewImage({
current: this.data.imgalist, // 当前显示图片的http链接
urls: this.data.imgalist // 需要预览的图片http链接列表
})
wx.getImageInfo({// 获取图片信息（此处可不要）
src: 'https://www.cslpyx.com/weiH5/jrkj.jpg',
success: function (res) {
console.log(res.width)
console.log(res.height)
}
})
},
7.更换皮肤颜色
demo.wxml
<view class='page' id='{{SkinStyle}}'>
<view class='header'>
<view class='h-skin iconfont {{SkinStyle!=="normal"?"icon-moon":"icon-sun"}}' bindtap='bgBtn'>skin</view>
</view>
</view>
app.js
globalData: {
skin: "normal",
}
demo.js
data: {
SkinStyle: "normal"
},
bgBtn: function () {
if (this.data.SkinStyle === "normal") {
app.globalData.skin = "dark"; //设置app（）中皮肤的类型
this.setData({
SkinStyle: app.globalData.skin //设置SkinStyle的值
})
wx.setStorage({ //设置storage
key: 'skins',
data: app.globalData.skin,
})
} else {
app.globalData.skin = "normal";
this.setData({
SkinStyle: "normal"
})
wx.setStorage({
key: 'skins',
data: app.globalData.skin,
})
}
},
8.小程序跳转tabbar页面 使用wx:switch
例如：
urlHome:function(){
wx.switchTab({
url:'../home/home'
})
},
9.小程序中使用地图导航
data:{
markers: [{
latitude: 23.099994,
longitude: 113.324520,
name: 'T.I.T 创意园',
desc: '我现在的位置'
}],
covers: [{
latitude: 23.099794,
longitude: 113.324520,
rotate: 10
}, {
latitude: 23.099298,
longitude: 113.324129,
rotate: 90
}]
}
onLoad: function (options) {
console.log('地图定位！')
var that = this
wx.getLocation({
type: 'gcj02', //返回可以用于wx.openLocation的经纬度
success: function (res) {
console.log(res)
var latitude = res.latitude;
var longitude = res.longitude;
wx.openLocation({
latitude: latitude,
longitude: longitude,
scale: 1
})
}
});
},
<view class="page-section page-section-gap">
<map
id="myMap"
style="width: 100%; height: 300px;"
latitude="{{latitude}}"
longitude="{{longitude}}"
markers="{{markers}}"
covers="{{covers}}"
show-location
></map>
</view>
