[原创]微信小程序获取网络类型的方法示例


Posted in Javascript onMarch 01, 2019

本文实例讲述了微信小程序获取网络类型的方法。分享给大家供大家参考,具体如下:

这里主要演示通过wx.getNetworkType获取当前网络类型的操作方法。代码如下:

index.js:

Page({
 /**
  * 页面的初始数据
  */
 data: {
  netType:''
 },
 /**
  * 生命周期函数--监听页面加载
  */
 onLoad: function () {
  var that = this;
  try {
   wx.getNetworkType({
    success: function(res) {
     that.setData({
      netType:res.networkType
     })
    },
   })
  } catch (e) {
   // Do something when catch error
  }
 },
 /**
  * 生命周期函数--监听页面初次渲染完成
  */
 onReady: function () {
  
 },
 /**
  * 生命周期函数--监听页面显示
  */
 onShow: function () {
 },
 /**
  * 生命周期函数--监听页面隐藏
  */
 onHide: function () {
 },
 /**
  * 生命周期函数--监听页面卸载
  */
 onUnload: function () {
 },
 /**
  * 页面相关事件处理函数--监听用户下拉动作
  */
 onPullDownRefresh: function () {
 },
 /**
  * 页面上拉触底事件的处理函数
  */
 onReachBottom: function () {
 },
 /**
  * 用户点击右上角分享
  */
 onShareAppMessage: function () {
 }
})

index.wxml:

<view class="table">
 <view class="tr bg-g">
  <view class="td">网络类型</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;
}

运行结果:

[原创]微信小程序获取网络类型的方法示例

希望本文所述对大家微信小程序开发有所帮助。

Javascript 相关文章推荐
强悍无比的WEB开发好助手FireBug(Firefox Plugin)
Jan 16 Javascript
浅析jQuery(function(){})与(function(){})(jQuery)之间的区别
Jan 09 Javascript
jquery实现在页面加载完毕后获取图片高度或宽度
Jun 16 Javascript
jQuery实现鼠标经过提示信息的地图热点效果
Apr 26 Javascript
JQuery中DOM实现事件移除的方法
Jun 13 Javascript
js图片轮播手动切换效果
Nov 10 Javascript
AngularJS控制器controller给模型数据赋初始值的方法
Jan 04 Javascript
AngularJS实现select的ng-options功能示例
Jul 12 Javascript
JavaScript中的高级函数
Jan 04 Javascript
vue微信分享的实现(在当前页面分享其他页面)
Apr 16 Javascript
react使用antd表单赋值,用于修改弹框的操作
Oct 29 Javascript
微信小程序实现点击导航标签滚动定位到对应位置
Nov 19 Javascript
使用JavaScript解析URL的方法示例
Mar 01 #Javascript
可能被忽略的一些JavaScript数组方法细节
Feb 28 #Javascript
Vue插件从封装到发布的完整步骤记录
Feb 28 #Javascript
Javascript删除数组里的某个元素
Feb 28 #Javascript
vue强制刷新组件的方法示例
Feb 28 #Javascript
ES6中Set和Map数据结构,Map与其它数据结构互相转换操作实例详解
Feb 28 #Javascript
Vue CLI3.0中使用jQuery和Bootstrap的方法
Feb 28 #jQuery
You might like
php for 循环语句使用方法详细说明
2010/05/09 PHP
php通过分类列表产生分类树数组的方法
2015/04/20 PHP
PHP根据图片色界在不同位置加水印的方法
2015/07/01 PHP
PHP搭建大文件切割分块上传功能示例
2017/01/04 PHP
类似CSDN图片切换效果脚本
2009/09/17 Javascript
JS上传前预览图片实例
2013/03/25 Javascript
javascript跟随滚动效果插件代码(javascript Follow Plugin)
2013/08/03 Javascript
javascript弹出页面回传值的方法
2015/01/28 Javascript
jQuery右侧选项卡焦点图片轮播特效代码分享
2015/09/05 Javascript
js调用百度地图及调用百度地图的搜索功能
2015/09/07 Javascript
js实现的页面矩阵图形变换特效
2016/01/26 Javascript
JQuery用户名校验的具体实现
2016/03/18 Javascript
vue的基本用法与常见指令
2017/08/15 Javascript
JavaScript如何获取一个元素的样式信息
2019/07/29 Javascript
微信小程序实现组件顶端固定或底端固定效果(不随滚动而滚动)
2020/04/09 Javascript
tornado捕获和处理404错误的方法
2014/02/26 Python
用Python实现协同过滤的教程
2015/04/08 Python
python实现查找excel里某一列重复数据并且剔除后打印的方法
2015/05/26 Python
Python3操作SQL Server数据库(实例讲解)
2017/10/21 Python
Python实现读取Properties配置文件的方法
2018/03/29 Python
实例详解Matlab 与 Python 的区别
2019/04/26 Python
Python学习笔记之抓取某只基金历史净值数据实战案例
2019/06/03 Python
对pytorch的函数中的group参数的作用介绍
2020/02/18 Python
微信小程序“圣诞帽”的实现思路详解
2017/12/28 HTML / CSS
移动端Html5中百度地图的点击事件
2019/01/31 HTML / CSS
学校万圣节活动方案
2014/02/13 职场文书
三方协议书范本
2014/04/22 职场文书
反四风对照检查材料
2014/09/22 职场文书
承诺函格式模板
2015/01/21 职场文书
个人工作保证书
2015/02/28 职场文书
2016教师校本培训心得体会
2016/01/08 职场文书
Python使用Kubernetes API访问集群
2021/05/30 Python
详解Python内置模块Collections
2022/03/22 Python
nginx.conf配置文件结构小结
2022/04/08 Servers
一篇文章带你掌握SQLite3基本用法
2022/06/14 数据库
JS前端使用canvas实现物体的点选示例
2022/08/05 Javascript