[트러블 슈팅]-라우터 params undefined 문제

<template>
    <div class="box">
        <div class="images">
        
        </div>
        <hr/>
        <div class="profile">
            <div class="user">
                <div class="photo">
                    
                </div>
                <div>
                    
                </div>
            </div>

            <div>

            </div>
        </div>
        <hr/>
        <div>
           
        </div>

    </div>
</template>



<script>
export default{

    data(){
        return{
            item:{},
            
        }
    },
    mounted(){
        //this.item=this.$axios.get(`http://localhost:8080/item/${this.$router.params.id}`);
        console.log(this.$router.params);
    }



}
</script>



<style scoped>
.photo{
    border: 1px solid black;
    border-radius: 50%;
     width: 50px;
     height: 50px;
}
.images{
    width: 729px;
    height: 502px;
}
.images img{
    width: 100%;
    height: 100%;
}
.box{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  
}
.user{
    display: flex;
}
.profile{
    display: flex;
   
    width:729px;
}
</style>

마운트 직후 라우터에서 params를 불러올때 undefined 가 불러지는 문제입니다.

 

해결

this.$router.currentRoute._value.params 를 사용하면 해결됩니다.