OhPlay/pages/demo/mqtt/deviceInfo.vue

<template>
  <view class="device-info">
    <text v-for="(item,index) in infoList" :key="index" space="ensp" class="t">
      {{item.key}} : {{item.element}}
    </text>

  </view>
</template>

<script>

export default {
  components: {},
  data: () => ({
    uuid:'',
    list:[]
  }),
  computed: {
    infoList(){
      let object = this.$store.getters['moduleMqtt/getDeviceById'](this.uuid)
      if(object){
        let list = []
        for (const key in object) {
          if (Object.hasOwnProperty.call(object, key)) {
            const element = object[key];
            list.push({
              key,
              element,
            })
          }
        }
        return list
      }else{
        return []
      }
    }
  },
  methods: {
    
  },
  watch: {},

  // 页面周期函数--监听页面加载
  onLoad(options) {
    this.uuid = options.uuid
  },
  // 页面周期函数--监听页面初次渲染完成
  onReady() {},
  // 页面周期函数--监听页面显示(not-nvue)
  onShow() {},
  // 页面周期函数--监听页面隐藏
  onHide() {},
  // 页面周期函数--监听页面卸载
  onUnload() {},
  // 页面处理函数--监听用户下拉动作
  onPullDownRefresh() {
    uni.stopPullDownRefresh();
  },
  // 页面处理函数--监听用户上拉触底
  onReachBottom() {},
  // 页面处理函数--监听页面滚动(not-nvue)
  /* onPageScroll(event) {}, */
  // 页面处理函数--用户点击右上角分享
  /* onShareAppMessage(options) {}, */
};
</script>

<style>
.device-info{
  display: flex;
  flex-direction: column;
}
.t{
  margin: 10rpx;
}
</style>