get-system-info.uvue

<template>
  <!-- #ifdef APP -->
  <scroll-view style="flex: 1">
  <!-- #endif -->
    <view>
      <page-head :title="title"></page-head>
      <view class="uni-common-mt">
        <view class="uni-list">
          <view class="uni-list-cell" v-for="(item, _) in items" style="align-items: center">
            <view class="uni-pd">
              <view class="uni-label" style="width: 180px">{{
                item.label
              }}</view>
            </view>
            <view class="uni-list-cell-db">
              <text style="width: 100%;">{{ item.value == '' ? '未获取' : item.value }}</text>
            </view>
          </view>
        </view>
        <view class="uni-padding-wrap">
          <view class="uni-btn-v">
            <button type="primary" @tap="getSystemInfoSync">
              同步获取设备系统信息
            </button>
            <button type="primary" @tap="getSystemInfo" style="margin-top: 20px;">
              异步获取设备系统信息
            </button>
          </view>
        </view>
      </view>
    </view>
  <!-- #ifdef APP -->
  </scroll-view>
  <!-- #endif -->
</template>
<script>
  type Item = {
    label : string,
    value : string,
  }
  const globalScreenHeight = uni.getSystemInfoSync().screenHeight
  export default {
    data() {
      return {
        title: 'getSystemInfo',
        items: [] as Item[],
        screenHeightAtReady: 0,
        jest_result: false,
      }
    },
    onUnload: function () {
    },

    onReady() {
      this.screenHeightAtReady = uni.getSystemInfoSync().screenHeight
      console.log(`全局获取屏幕高度: ${globalScreenHeight}  onReady内获取屏幕高度: ${this.screenHeightAtReady}`);
    },
    methods: {
      getSystemInfo: function () {
        uni.getSystemInfo({
          success: (res) => {
            this.items = [] as Item[];
            const res_str = JSON.stringify(res);
            const res_obj =  JSON.parseObject(res_str);
            const res_map = res_obj!.toMap();
            let keys = [] as string[]
            res_map.forEach((_, key) => {
               keys.push(key);
            });
            keys.sort().forEach( key => {
              const value = res[key];
              if(value != null){
                const item = {
                	label: key,
                	value: "" + ((typeof value == "object")? JSON.stringify(value) : value)
                } as Item;
                this.items.push(item);
              }
            });
          },
        })
      },
      getSystemInfoSync: function () {
        this.items = [] as Item[];
        const res = uni.getSystemInfoSync()
        const res_str = JSON.stringify(res);
        const res_obj =  JSON.parseObject(res_str);
        const res_map = res_obj!.toMap();
        let keys = [] as string[]
        res_map.forEach((_, key) => {
           keys.push(key);
        });
        keys.sort().forEach( key => {
          const value = res[key];
          if(value != null){
            const item = {
            	label: key,
            	value: "" + ((typeof value == "object")? JSON.stringify(value) : value)
            } as Item;
            this.items.push(item);
          }
        });
      },
      //自动化测试例专用
      jest_getSystemInfo() : GetSystemInfoResult {
        return uni.getSystemInfoSync();
      },
      jest_getScreenHeight_at_different_stages(){
        this.jest_result = (globalScreenHeight == this.screenHeightAtReady)
      }
    }
  }
</script>

<style>
  .uni-pd {
    padding-left: 15px;
  }
</style>