Vue.jsテンプレートCONCATENATEは

Question

JS小道具：

Vue.component('profile', { 
    template: `<a v-bind:href="id"></a>`, 

    props: ['id'] 
}); 

var app = new Vue({ 
    el: '.app', 
    data: { 
     user: userobject 
    } 
}); 

HTML：

<profile :id="user.id"></profile> 

期待される結果：

<a href="/profile/2"> 

質問： どうuser.idで"/profile/"を連結することに等しく、 2？あなたはこのようなVueのテンプレートではJavaScriptをインラインで書くことができます

Answer 1

：

template: `<a v-bind:href="'/profile/' + id"></a>`, 

---

代わりに、あなたは計算されたプロパティにバインドすることができます：

Vue.component('profile', { 
    template: `<a v-bind:href="url"></a>`, 
    props: ['id'], 
    computed: { 
    url() { 
     return '/profile/' + this.id; 
    } 
    } 
}); 

を