Vue jsの小道具値が定義されていない

Question

小道具の理解に間違いかもしれませんが、コンポーネントに小道具を渡してその値を取得することはできません。

経路：

<router-link class="btn btn-warning margin-bottom-20" :to="{ name: 'acccount', params: {username: user.username}}">Edit</router-link> 

コンポーネント：

export default { 
    name: 'account', 

    props: ['username'], 

    computed: { 
    user() { 
     return this.$store.getters.getUser(this.username); 
    } 
    } 
} 

マイ/アカウントがsuccefully変更/アカウ​​ントへ/ {ユーザー名}表示が、コンポーネントに

{ 
    path: '/account/:username', 
    name: 'acccount', 
    component: Account 
}, 

ルータリンク一度コンポーネント上でthis.usernameの値は何も返されませんが、未定義です。

Answer 1

あなたのルートを更新します。

{ 
    path: '/account/:username', 
    name: 'acccount', 
    component: Account 
} 

へ：

{ 
    path: '/account/:username', 
    name: 'acccount', 
    component: Account, 
    props: true 
}