<a>タグ - laravel、vue.js、laravel-5.3、vuejs2、v-forのhrefにVueJSデータバインディング式を書き込む

私はLaravel 5.3でVueJS 2.0を使用しています。私はVue配列データを持っています（例えば、 items）。今私はテーブル内のそれらのデータをレンダリングしたい v-for。テーブルには、ページをアイテムの詳細ページにリダイレクトするためのボタンがあります。そのためには、静的なURLを書くまで / タグのhrefにそれから{{item.id}}を追加していますが、このエラーが発生しています。

属性内の内挿が削除されました。 v-bindまたは 代わりにコロンを使用します。例えば、代わりに、 つかいます <div :id="val">

だから、VueJSのデータバインディング表現を書く方法を知ることはできません <a href="">。誰かが解決策を知っていれば、それは評価されます。

ここに私のコードです。

my-items.blade.php

<div id="app">
....
<tr v-for="item in items">
<td>
<a href="{{url("/item")}}/@{{item.id}}">view</a>
</td>
</tr>
....
</div>

my-items.js

new Vue({
el: "#app",
data: {
items: [
{id: 1},
{id: 2},
{id: 3}
]
},
})

EDIT

ここで私がLaravel 5.2でAngularJSでやっていたことがあります。そして私はこのように似ています。

<a href="{{url("/item")}}/@{{item.id}}">view</a>

回答：

次のようにする必要があります：

<tr v-for="item in items">
<td>
<a :href=""{{url("/item")}}/" + item.id" />
</td>
</tr>

相対URLではなく固定URLを維持することができない場合は、これを考慮してください：

<div id="app">
<tr v-for="item in items">
<td>
<a :href=""{{ url("/item") }}" + "/" + @{{ item.id }}" />
</td>
</tr>
</div>