2

画像を適切に表示することはできますが、理由もなくコンソールに JavaScript エラーが表示されます。これが私のコードです：

取得カテゴリ:

fetchCategory: function(){

            this.$http.get('get_category').then(function(response){
                this.$set('categories',response.json());
            });
        }

カテゴリを表示するテーブルは次のとおりです。

<table class="table table-bordered table-responsive table-striped example1">
    <thead>
        <tr>
            <th>ID</th>
            <th>Category Name</th>
            <th>Icon</th>
            <th>Action</th>
        </tr>
    </thead>
    <tbody>
        <tr v-for="category in categories">
            <td>@{{ category.id }}</td>
            <td>@{{ category.name }}</td>
            <td><img src="{{url('/')}}/@{{ category.icon }}" width="150px"></td>
            <td>Edit | Delete</td>
        </tr>
    </tbody>
</table>

画像は適切に表示されますが、javascript コンソールには画像の URL を示す 2 404 エラーが表示されます GET http://localhost/project/%7B%7B%20category.icon%20%7D%7D 404 (Not Found)

このエラーを無視する必要がありますか? または、画像パスにベース URL を含める他の方法はありますか?

4

2 に答える 2

3

src属性をバインドする必要があります。

<img :src="'{{ url('/') }}/' + category.icon" width="150px">
于 2016-07-09T12:04:16.160 に答える
0

このようにしてみてください：

<td>{!!HTML::image('path/category.icon')!!}</td>
于 2016-07-09T09:52:33.027 に答える