Cant get value in Vue from data

Question

I am pulling data via an API and it appears in my vue console but when i try and pull it into my markup nothing displays?

clicks:"27,577"
earnings_per_click:"257.11"
orders:"10,722"
advertiser_id:"3184"

Data is pulling through like this. Can get clicks, earnings, orders etc fine using v-html but advertiser_id is always blank.

Can the data be read only in some way or protected? Pretty sure it wouldn't show up in the vue console if it was?

The api itself looks like so:

{
  "1": {
    "advertiser_id": "3184",
    "clicks": "27,577",
    "orders": "10,722",
    "earnings_per_click": "257.11",
  },
}

Answer 1

If I understood You correctly , maybe like following snippet (can use v-for for object)

const app = Vue.createApp({
  data() {
    return {
      item: {
        "1": {
          "advertiser_id": "3184",
          "clicks": "27,577",
          "orders": "10,722",
          "earnings_per_click": "257.11",
        },
      }
    };
  },
})
app.mount('#demo')

<script src="https://unpkg.com/vue@3/dist/vue.global.prod.js"></script>
<div id="demo">
  <div v-for="(val, key, i) in item['1']" :key="i">
    {{ key }} - {{ val }}
  </div>
</div>