zoukankan      html  css  js  c++  java
  • 微信小程序---系统信息-位置信息-定位信息

     // 获取用户资料
        wx.getUserInfo({
          success:function(res){
            that.setData({
              userinfo:res.userInfo
            });
          }
        });
    
        // 获取系统资料
        wx.getSystemInfo({
          success:function(res){
            that.setData({
              systemInfo : res
            });
          }
        });
        // 获取位置信息
        wx.getLocation({
          success:function(res){
            that.setData({
              location:res
            });
          }
        });

    内容显示

    <view class="header">
        <image class="user-header" src="{{userinfo.avatarUrl}}"></image>
        <text  >{{userinfo.province}}  {{userinfo.city}}</text>
        <text >{{userinfo.nickName}}</text>
      </view>
      <view class="slice-line"></view>
      <view class="center">
        <text class="text">系统信息</text>
      </view>
      <view class="info-box">
        <text class="info-text">手机型号:{{systemInfo.model}}</text>
        <text class="info-text">设备像素比:{{systemInfo.pixelRatio}}</text>
        <text class="info-text">窗口宽度:{{systemInfo.windowWidth}}</text>
        <text class="info-text">窗口高度:{{systemInfo.windowHeight}}</text>
        <text class="info-text">微信设置的语言:{{systemInfo.language}}</text>
        <text class="info-text">微信版本号:{{systemInfo.version}}</text>
      </view>
      <view class="center">
        <text class="text">位置信息</text>
      </view>
      <view class="slice-line"></view>
      <view class="info-box">
        <text class="info-text">纬度:{{location.latitude}}</text>
        <text class="info-text">经度:{{location.longitude}}</text>
        <text class="info-text">速度:{{location.speed}}</text>
        <text class="info-text">位置精确度:{{location.accuracy}}</text>
      </view>
      <view style="margin-top:100rpx;100%;height:2rpx;"></view>
  • 相关阅读:
    每位设计师都应该拥有的50个CSS代码片段(下)
    每位设计师都应该拥有的50个CSS代码片段(上)
    canvas基础——绘制简单的图形
    HTML5——canvas基础
    link和@import的有何区别应如何选择
    火焰灯效果导航菜单
    简单的 Jquery 下拉菜单Demo
    git多人协作冲突解决方法
    搭建iis本地测试服务器
    HTML5 <template>
  • 原文地址:https://www.cnblogs.com/xzma/p/7462067.html
Copyright © 2011-2022 走看看