show data from json with vue.js

Question

Hi am trying to show some data from json with vue.js this is my vue file:

<template>
    <div>
        <div class="card">
            <div class="card-header">
                  <h4 class="card-title">Customer Infos</h4>
            </div>      
            <div class="card-content">
             {{site}}
            </div>      
        </div>
    </div>
</template>
<script>
    export default {
        props: ['site'],
        mounted () {
            console.dir(this.site)
        }
    }
</script>
<style>
</style>

and this is the result:

{"id":274292982,"site_id":"2512016716"}}

i want to make it only show site_id

i have already tried this:

 {{site.site_id}}

no success. thanks you.

Answer 1

computed: {
siteObject() {
    return JSON.parse(this.site);
}

after

{{ siteObject.site_id }}