属性或方法不是在实例上定义的，而是引用。需要建议

Question

我打算根据商店内的状态打印对象的键和值： 但我收到此错误：

  

[Vue警告]：属性或方法“ deviceInfo”未在实例上定义，但在渲染期间被引用。通过初始化属性，确保该属性在data选项中或对于基于类的组件都是反应性的。

我在做什么错了？

<template>
    <div id="device-details-view">      
         {{deviceinfo['OffenderID']}}   <!--WORKS-->
         {{deviceinfo[Object.keys(deviceinfo)[0]]}}   <!--WORKS-->

       <!--NOR WORKING-->

        <div class="device-info-container" v-for="(field, key, index) in deviceInfo" :key="index">
            <LabelAndData :key="index" :title="key" :data="field"/>
        </div> 
    </div>
</template>

<script>
import { mapGetters, mapMutations } from "vuex";
import  LabelAndData from "../common/List";

const DeviceAgencyIDTitle='Agency ID'; 
const DeviceOffenderID='OffenderID';
const DeviceSerialNumber='Serial Number';
const DeviceDescription='Description';
const DeviceOffenderNameTitle='Offender Name';

const DeviceInfo = (device) => {
    const deviceDataList =[ {      
        [DeviceSerialNumber]: device.SerialNumber,        
        [DeviceDescription]: device.Description,                 
        [DeviceOffenderID]: device.OffenderID,         
        [DeviceAgencyIDTitle]: device.AgencyID
    }]
}

export default {

  components: {
    LabelAndData
  },
  computed: {
    ...mapGetters({
      currentDevice: 'currentDevice'
    }),
    deviceinfo: function () {
      //return "test";
      //DeviceInfo(this.$store.getters.currentDevice);
      const device = this.$store.getters.currentDevice;
      const deviceDataList = [{
        [DeviceSerialNumber]: device.SerialNumber,
        [DeviceDescription]: device.Description,
        [DeviceOffenderID]: device.OffenderID,
        [DeviceAgencyIDTitle]: device.AgencyID

      }]
      return deviceDataList[0];


    }
  }

}
</script>