ReactでJSONを取得して内容を表示するコードを書きました。しかし動かしてみるとid: title: summary: url: のように値が入るはずのところに何も入ってないものが出力されてしまいます。
URLのAPIはネットにある簡単なAPIのサンプルを使用しています。
下記のコードでJSONの値が表示されないのはなぜでしょうか。
VSCodeを使用。
ShowJson.js
1import React, { Component } from 'react'; 2 3class ShowJson extends Component { 4 constructor (props) { 5 super(props) 6 this.state = { 7 age: '', 8 name: '', 9 note: '', 10 } 11 } 12 componentWillMount () { 13 const URL = 'https://umayadia-apisample.azurewebsites.net/api/persons/Shakespeare' 14 fetch(URL, {mode: 'cors'}) 15 .then(res => res.json()) 16 .then(json => { 17 this.setState({ 18 age: json['age'], 19 name: json['name'], 20 note: json['note'], 21 }) 22 }); 23 } 24 25 render() { 26 return <div className='ShowJson'> 27 age: {this.state.age} <br /> 28 name: {this.state.name} <br /> 29 note: {this.state.note} <br /> 30 </div> 31 } 32} 33 34export default ShowJson; 35} 36 37export default ShowJson;
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2022/10/20 03:49
退会済みユーザー
2022/10/20 05:02
2022/10/20 06:23