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


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 相关文章推荐
Javascript实现DIV滚动自动滚动到底部的代码
Mar 01 Javascript
用jquery写的菜单从左往右滑动出现
Apr 11 Javascript
jQuery中die()方法用法实例
Jan 19 Javascript
利用Angularjs和Bootstrap前端开发案例实战
Aug 27 Javascript
jQuery实现的简单拖拽功能示例
Sep 13 Javascript
javascript加载xml 并解析各节点的值(实现方法)
Oct 12 Javascript
javascript html5轻松实现拖动功能
Mar 01 Javascript
javascript实现Emrips反质数枚举的示例代码
Dec 06 Javascript
对Vue2 自定义全局指令Vue.directive和指令的生命周期介绍
Aug 30 Javascript
微信JS-SDK updateAppMessageShareData安卓不能自定义分享详解
Mar 29 Javascript
详解javascript中的Error对象
Apr 25 Javascript
vue Tab切换以及缓存页面处理的几种方式
Nov 05 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伪静态页面函数附使用方法
2008/06/20 PHP
PHP5中使用DOM控制XML实现代码
2010/05/07 PHP
PHP 5.3新增魔术方法__invoke概述
2014/07/23 PHP
PHP连接access数据库
2015/03/27 PHP
JavaScript实现滚动栏效果的方法
2015/04/27 PHP
PHP多维数组转一维数组的简单实现方法
2015/12/23 PHP
php mysql like 实现多关键词搜索的方法
2016/10/29 PHP
php rsa 加密,解密,签名,验签详解
2016/12/06 PHP
js制作的鼠标悬浮时产生的下拉框效果
2012/10/27 Javascript
js Select下拉列表框进行多选、移除、交换内容的具体实现方法
2013/08/13 Javascript
node.js中的fs.openSync方法使用说明
2014/12/17 Javascript
javascript实时获取鼠标坐标值并显示的方法
2015/04/30 Javascript
微信小程序wx:for和wx:for-item的用法详解
2018/04/01 Javascript
mpvue全局引入sass文件的方法步骤
2019/03/06 Javascript
在vue中对数组值变化的监听与重新响应渲染操作
2020/07/17 Javascript
vue 动态设置img的src地址无效,npm run build 后找不到文件的解决
2020/07/26 Javascript
[02:09]EHOME夺得首届辉夜杯冠军—现场颁奖仪式
2015/12/28 DOTA
[01:10]为家乡而战!完美世界城市挑战赛全国总决赛花絮
2019/07/25 DOTA
Python创建模块及模块导入的方法
2015/05/27 Python
在Mac OS上使用mod_wsgi连接Python与Apache服务器
2015/12/24 Python
解决python有时候import不了当前的包问题
2019/08/28 Python
使用SVG实现提示框功能的示例代码
2020/06/05 HTML / CSS
Melijoe时尚童装德国官网:Melijoe德国
2016/09/03 全球购物
优衣库美国官网:UNIQLO美国
2018/04/14 全球购物
L’AGENCE官网:加州女装品牌
2018/06/03 全球购物
SCHIESSER荷兰官方网站:德国内衣专家
2020/10/09 全球购物
总裁办公室主任职责
2014/01/02 职场文书
机关作风建设自查报告及整改措施
2014/10/21 职场文书
党支部四风整改方案
2014/10/25 职场文书
2014年小学语文工作总结
2014/12/20 职场文书
世界遗产的导游词
2015/02/13 职场文书
晚会主持人开场白台词
2015/05/28 职场文书
学生会主席任命书
2015/09/21 职场文书
2019交通安全宣传标语集锦!
2019/06/28 职场文书
浅谈Python数学建模之线性规划
2021/06/23 Python
Python常遇到的错误和异常
2021/11/02 Python