Vue JSとURLの末尾に変数を追加する

Question

私のページにはv-forメソッドがあり、一連の数値を出力しています。

1234 
122356 
124 
12312 

マイV-のための出力をこれらの数値のそれぞれと、私は次のようなリンクにそれらを追加する必要があります：

<a href="/order/1234">1234</a> 
<a href="/order/122356">122356</a> 
<a href="/order/124">124</a> 
<a href="/order/12312">12312</a> 

私は現在

<a href="/order/{{ order.number }}">1234</a> 
<a href="/order/{{ order.number }}">122356</a> 
<a href="/order/{{ order.number }}">124</a> 
<a href="/order/{{ order.number }}">12312</a> 

誰も私を伝えることができます私は間違っているの？

Answer 1

次のようにあなたは、このような場合のためにv-bind directiveを使用する必要があります。

<a v-bind:href="'/order/' + order.number">1234</a> 
<a v-bind:href="'/order/' + order.number">122356</a> 
<a v-bind:href="'/order/' + order.number">124</a> 
<a v-bind:href="'/order/' + order.number">12312</a> 

またはショートにあなたにも、以下の書き込みが可能に：

<a :href="'/order/' + order.number">1234</a> 
<a :href="'/order/' + order.number">122356</a> 
<a :href="'/order/' + order.number">124</a> 
<a :href="'/order/' + order.number">12312</a>