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


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 相关文章推荐
浅析jquery ajax异步调用方法中不能给全局变量赋值的原因及解决方法
Jan 10 Javascript
JavaScript使用encodeURI()和decodeURI()获取字符串值的方法
Aug 04 Javascript
JavaScript对象数组的排序处理方法
Oct 21 Javascript
jQuery实现区域打印功能代码详解
Jun 17 Javascript
jQuery Validate让普通按钮触发表单验证的方法
Dec 15 Javascript
JavaScript实现向select下拉框中添加和删除元素的方法
Mar 07 Javascript
js按条件生成随机json:randomjson实现方法
Apr 07 Javascript
Vue中计算属性computed的示例解读
Jul 26 Javascript
基于 Vue.js 2.0 酷炫自适应背景视频登录页面实现方式
Jan 17 Javascript
jQuery选择器之基本选择器用法实例分析
Feb 19 jQuery
javascript数组去重方法总结(推荐)
Mar 20 Javascript
微信小程序scroll-view锚点链接滚动跳转功能
Dec 12 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管理依赖(dependency)关系工具 Composer 安装与使用
2014/08/18 PHP
PHP语法小结之基础和变量
2015/11/22 PHP
PHP函数引用返回的实例详解
2016/09/11 PHP
Linux服务器下PHPMailer发送邮件失败的问题解决
2017/03/04 PHP
JavaScript 继承详解(三)
2009/07/13 Javascript
用 Javascript 验证表单(form)中多选框(checkbox)值
2009/09/08 Javascript
javascript中的变量是传值还是传址的?
2010/04/19 Javascript
基于jQuery的左右滚动实现代码
2010/12/03 Javascript
基于jquery的不规则矩形的排列实现代码
2012/04/16 Javascript
Javascript图像处理—为矩阵添加常用方法
2012/12/27 Javascript
在页面中js获取光标/鼠标的坐标及光标的像素坐标
2013/11/11 Javascript
图片放大镜jquery.jqzoom.js使用实例附放大镜图标
2014/06/19 Javascript
jQuery实现根据滚动条位置加载相应内容功能
2016/07/18 Javascript
js实现动态创建的元素绑定事件
2016/07/19 Javascript
AngularJS API之copy深拷贝详解及实例
2016/09/14 Javascript
jQuery仿写百度百科的目录树
2017/01/03 Javascript
详解Vue 全局引入bass.scss 处理方案
2018/03/26 Javascript
解决Vue.js由于延时显示了{{message}}引用界面的问题
2018/08/25 Javascript
微信小程序如何修改本地缓存key中单个数据的详解
2019/04/26 Javascript
简述Vue中容易被忽视的知识点
2019/12/09 Javascript
解决vue项目,npm run build后,报路径错的问题
2020/08/13 Javascript
vue中选中多个选项并且改变选中的样式的实例代码
2020/09/16 Javascript
[01:25:33]完美世界DOTA2联赛PWL S3 INK ICE vs Magma 第二场 12.20
2020/12/23 DOTA
Python3爬虫学习之MySQL数据库存储爬取的信息详解
2018/12/12 Python
详解Python列表赋值复制深拷贝及5种浅拷贝
2019/05/15 Python
Python TKinter如何自动关闭主窗口
2020/02/26 Python
美国职棒大联盟的官方手套、球和头盔:Rawlings
2020/02/15 全球购物
校三好学生主要事迹
2014/01/11 职场文书
教师申诉制度
2014/01/29 职场文书
个人委托书范本汇总
2014/10/01 职场文书
学校光盘行动倡议书
2015/04/28 职场文书
《所见》教学反思
2016/02/23 职场文书
2019年年中工作总结讲话稿模板
2019/03/25 职场文书
创业计划书之美甲店
2019/09/20 职场文书
Nginx配置根据url参数重定向
2022/04/11 Servers
为什么MySQL8新特性会修改自增主键属性
2022/04/18 MySQL