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


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 相关文章推荐
js操作textarea方法集合封装(兼容IE,firefox)
Feb 22 Javascript
Javascript数组与字典用法分析
Dec 13 Javascript
javascript制作幻灯片(360度全景图片)
Jul 28 Javascript
使用jQuery UI库开发Web界面的简单入门指引
Apr 22 Javascript
js删除Array数组中指定元素的两种方法
Aug 03 Javascript
String字符串截取的四种方式总结
Nov 28 Javascript
jQuery自定义图片上传插件实例代码
Apr 04 jQuery
浅谈在Vue.js中如何实现时间转换指令
Jan 06 Javascript
详解关于表格合并span-method方法的补充(表格数据由后台动态返回)
May 21 Javascript
vue实现权限控制路由(vue-router 动态添加路由)
Nov 04 Javascript
js判断浏览器的环境(pc端,移动端,还是微信浏览器)
Dec 24 Javascript
Vue插槽_特殊特性slot,slot-scope与指令v-slot说明
Sep 04 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获取bing每日壁纸示例分享
2014/02/25 PHP
laravel框架模型、视图与控制器简单操作示例
2019/10/10 PHP
JavaScript 页面坐标相关知识整理
2010/01/09 Javascript
javascript工具库代码
2012/03/29 Javascript
JavaScript中将一个值转换为字符串的方法分析[译]
2012/09/21 Javascript
jQuery 事件的命名空间简单了解
2013/11/22 Javascript
angularJS提交表单(form)
2015/02/09 Javascript
jquery实现简单实用的弹出层效果代码
2015/10/15 Javascript
jQuery实现可以控制图片旋转角度效果(附demo源码下载)
2016/01/27 Javascript
JSON与String互转的实现方法(Javascript)
2016/09/27 Javascript
Bootstrap作品展示站点实战项目2
2016/10/14 Javascript
JS创建对象的写法示例
2016/11/04 Javascript
AngularJS的ng Http Request与response格式转换方法
2016/11/07 Javascript
jQuery设计思想
2017/03/07 Javascript
Vuex简单入门
2017/04/19 Javascript
node.js中debug模块的简单介绍与使用
2017/04/25 Javascript
Bootstrap table使用方法汇总
2017/11/17 Javascript
Python3实现Web网页图片下载
2016/01/28 Python
Python 比较两个数组的元素的异同方法
2017/08/17 Python
Python DataFrame设置/更改列表字段/元素类型的方法
2018/06/09 Python
在Python 不同级目录之间模块的调用方法
2019/01/19 Python
python根据多个文件名批量查找文件
2019/08/13 Python
python实现的汉诺塔算法示例
2019/10/23 Python
新手常见Python错误及异常解决处理方案
2020/06/18 Python
Python使用cn2an实现中文数字与阿拉伯数字的相互转换
2021/03/02 Python
香港现代设计家具品牌:Ziinlife Furniture
2018/11/13 全球购物
什么是数据库锁?Oracle中都有哪些类型的锁?
2015/08/21 面试题
大学毕业通用个人的求职信
2013/12/08 职场文书
搞笑获奖感言
2014/01/30 职场文书
中班幼儿评语大全
2014/04/30 职场文书
2014乡镇领导班子四风对照检查材料思想汇报
2014/10/05 职场文书
评先进个人材料
2014/12/29 职场文书
学雷锋日活动总结
2015/02/06 职场文书
体育教师研修感悟
2015/11/18 职场文书
python开发实时可视化仪表盘的示例
2021/05/07 Python
HTML+css盒子模型案例(圆,半圆等)“border-radius” 简单易上手
2021/05/10 HTML / CSS