vueのv-forを使用して、取得したjsonの画像パス(AWS S3)にアクセスしたいです。
が、書き方で詰まってしまいました。詳しい方、ご教示お願いできませんでしょうか。
前提・実現したいこと
records
には下記のようにIDを連番としたjsonデータが複数入っています。
json
1{ 2 "ID": 1, 3 "TopImagePath": "https://hoge.s3.us-east-2.amazonaws.com/images/000001.png" 4}
該当のソースコード
vue
1 <div class="container" v-for="record in records" v-bind:key="record.ID"> 2 <img src='{{record.TopImagePath}}'> 3 </div>
発生している問題・エラーメッセージ
v-forを使用したところ、文字列として解釈されてしまい、画像を表示しない。
GET http://localhost:8000/app/%7B%7Brecord.TopImagePath%7D%7D 404 (Not Found)
試したこと
<img src="https://hoge.s3.us-east-2.amazonaws.com/images/000001.png">
では表示できます。(URLの誤りのセンはありません)
なるべくシンプルに、複数の画像URLを表示したいです。
お詳しい方、ご教示お願いできませんでしょうか。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。