は、私は外部ファイルとイメージのソースをロードしようとしているが、私が直面してるJSONを介して、画像の「SRC」(Vue.js)
var topArticle=new Vue({
el:'#toparticle',
data:{topmostArticle:null},
created: function(){
fetch('topnews.json')
.then(r=>r.json())
.then(res=>{this.topmostArticle=$.grep(res,function(e){return e.topnews!==" "});
console.log(this.topmostArticle);
});
}
});
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>The greatest news app ever</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.3.1/css/foundation.min.css">
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<div id ="toparticle">
<img src="{{topmostArticle[0].topnews[0].img}}">
<img src="2.jpg">
"{{topmostArticle[0].topnews[0].img}}"
</div>
<script src="main.js"></script>
</body>
</html>
をロードCan'tいくつかの問題があります...画像タグでソースが認識されません。データがイメージタグの外に読み込まれたとき、それはうまく動作するので、コードは正しいはずです。誰でも何か考えがある?どうもありがとうございます!
srcがjson経由で送信されているため、最初の画像はロードされず、2番目の画像はokで、3番目のコマンド「{{topmostArticle [0] .topnews [0] .img}}」は "2それは大丈夫ですので.JPG」
JSON
[{"topnews":[
{"timestamp":"0",
"id":"2",
"cathegory":"2",
"headline":"2",
"text":"2",
"img":"2.jpg",
"url":"2.jpg",
"author":"2",
"comments":"2"
},
{"timestamp":"0",
"id":"2",
"cathegory":"3",
"headline":"3",
"text":"3",
"img":"3",
"url":"3",
"author":"3",
"comments":"3"
}
]}]
私はJSONから直接SRCを読み込むことができない理由の質問はありますか? より明確にするために、下のリンク(ウェブビュー)をクリックしてください!
それは何語ですか?問題に関連するコードを追加してください。画像をデバッグするのは難しいです。 – Teemu
これはhtmlとjavascriptになっています...あなたのブラウザで4つの画像のURLをコピーしてください...?投稿中にいくつかエラーが発生しました –
いいえ、あなたは質問を編集できます。関連するコードを投稿にコピーして貼り付け、貼り付けたコードを選択し、エディタツールの '{}'アイコンをクリックしてください。 – Teemu