VUE.JS после анализа через JSON, получая неправильный вывод

Question

Я сделал метод [GET], используя Axios.Все работает нормально, когда я хочу вывести, я получаю такие вещи:

http://prntscr.com/mpey70

Это мой JS с кодом HTML и VUE о том, как я пытаюсь вывести его:

HTML, VUE:

 <div class="col-lg-6">
                                <p>Casuals</p>
                                <ul>
                                    <div v-bind:key="realsub.id+1"  v-for="realsub in subnavreal">
                                      <div v-if="nav.linkTitle == 'Male'">
                                            <li><router-link :to="{ path: whiteSpace(realsub.male.casual) }">{{JSON.realsub.male.casual}}</router-link></li>
                                    </div>

                                        <div v-if="nav.linkTitle == 'Female'"></div>
                                            <li><router-link :to="{ path: whiteSpace(realsub.female.casual) }">{{realsub.female.casual}}</router-link></li>
                                        </div>

                                </ul>

                            </div>

И это относится к JS-коду:

    import axios from 'axios';
import uuid from 'uuid';
export default {
    name: 'navigation',
    data(){
        return{
            subnavreal: []

        }
    },
    props: ["navigation"],
    methods:{
        whiteSpace(a){

            console.log(a);
        }
    },
    async created(){

        axios.get('/products.json')
        .then(res => this.subnavreal = res.data)
        .catch(err => console.log(err));


    }

}
</script>

Я хочу показать только имя этого объекта, например: "Толстовки"

Есть решения?:)

Answer 1

Я думаю, что вы печатаете весь ответ.Вы можете использовать Object.keys () для печати ключей.

 let user = {
       name: "tom",
       age: 20
       }

Если вы хотите напечатать ключи [имя, возраст], используйте Object.keys(user)