微信小程序獲取網(wǎng)絡(luò)類型的方法示例原創(chuàng)

2019-11-19 12:03:22

字體：大中小

供稿：網(wǎng)友

本文實(shí)例講述了微信小程序獲取網(wǎng)絡(luò)類型的方法。分享給大家供大家參考，具體如下：

這里主要演示通過(guò)wx.getNetworkType獲取當(dāng)前網(wǎng)絡(luò)類型的操作方法。代碼如下：

index.js：

Page({ /**  * 頁(yè)面的初始數(shù)據(jù)  */ data: {  netType:'' }, /**  * 生命周期函數(shù)--監(jiān)聽頁(yè)面加載  */ onLoad: function () {  var that = this;  try {   wx.getNetworkType({    success: function(res) {     that.setData({      netType:res.networkType     })    },   })  } catch (e) {   // Do something when catch error  } }, /**  * 生命周期函數(shù)--監(jiān)聽頁(yè)面初次渲染完成  */ onReady: function () {   }, /**  * 生命周期函數(shù)--監(jiān)聽頁(yè)面顯示  */ onShow: function () { }, /**  * 生命周期函數(shù)--監(jiān)聽頁(yè)面隱藏  */ onHide: function () { }, /**  * 生命周期函數(shù)--監(jiān)聽頁(yè)面卸載  */ onUnload: function () { }, /**  * 頁(yè)面相關(guān)事件處理函數(shù)--監(jiān)聽用戶下拉動(dòng)作  */ onPullDownRefresh: function () { }, /**  * 頁(yè)面上拉觸底事件的處理函數(shù)  */ onReachBottom: function () { }, /**  * 用戶點(diǎn)擊右上角分享  */ onShareAppMessage: function () { }})

index.wxml：

<view class="table"> <view class="tr bg-g">  <view class="td">網(wǎng)絡(luò)類型</view>  <view class="td">{{netType}}</view> </view></view>

index.wxss：

/**index.wxss**/.table { border: 0px solid darkgray;}.tr { display: flex; width: 100%; justify-content: center; height: 2.6rem; align-items: center;}.td {  width:40%;  justify-content: center;  text-align: center;}.bg-g{ background: #E6F3F9;}

運(yùn)行結(jié)果：