Q&A
Jsonデータを取ってきて
HTMLに描画したいのですが
表示されません。
具体的には
定義されているはずなのですが
contentsという変数が未定義とでており、原因がわからずにおります。。
（エラー内容のほかにも、その他、おかしい箇所があるかもしれません。）
JS
1let url = 'https://jsonplaceholder.typicode.com/users/1'; 2 3fetch(url) 4 .then(response => response.json()) 5 .then(data => { 6 console.log(data) 7 let contents = ''; 8 Object.keys(data).map((value, i) => { 9 contents += '<div key={i}><p>Title: {value.name}</p></div>'; 10 }); 11 }); 12 document.getElementById("root").innerHTML = contents;
HTML
1<!DOCTYPE html> 2<html lang="en"> 3<head> 4 <meta charset="UTF-8"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 7 <title>js_test</title> 8 <link rel="stylesheet" href="css/main.css"> 9</head> 10<body> 11<div id="root"></div> 12<script src="js/main.js"></script> 13</body> 14</html>
回答1件
0
ベストアンサー
js
1 }); 2 document.getElementById("root").innerHTML = contents;
この2行を入れ替えてください。変数 contents は、それを宣言したブロック {} 内でのみ有効です。
投稿2022/06/23 21:45
総合スコア20850
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2022/06/24 06:49
2022/06/24 06:50