member nggk lengkap

Ditanyakan pada tanggal 31 July 2020 oleh Gelar Rahadian Fajar Edit  Hapus  Buka Kembali  Tandai 
kak punya saya yang muncul hanya id nya doank first_name sama last_name nya nggk muncul knapa ya kak? mohon penjelasanya

class App extends Component {

  constructor() {
    super()
    this.state = {
      members: []
    }
  }
  componentDidMount() {
    Axios.get('http://reqres.in/api/user?page=2')
    .then(Response => {
      this.setState({ members: Response.data.data })
    })
    .catch(error => {
      console.log(error)
    })
  }
  render() {
    return(
      <div className="container">
      <h1>Gelarahadian Devschooll</h1>
      <div className="row">
        <div className="col-md-6" style={{border:"1px solid black"}}>
          <h2>Member</h2>
          <div className="row">
          {this.state.members.map((member, index) => (
             <div className="col-md-6" key={member.id}>
             <div className="card" style={{margin: 10}}>
               <div className="card-body">
                 <h5 className="card-title">{member.id}</h5>
                 <h5 className="card-title">{member.first_name}</h5>
                 <h5 className="card-title">{member.last_name}</h5>
                 <button className="btn btn-primary">EDIT</button>
                 <button className="btn btn-danger">DELETE</button>
               </div>
             </div>
           </div>
          ))}
          </div>
        </div>
        <div className="col-md-6" style={{border:"1px solid black"}}>
          <h2>form</h2>
          <form>
            <div className="form-group">
              <label>First Name</label>
              <input 
              type="text"
              className="form-control"/>
            </div>
            <div className="form-group">
              <label>Last Name</label>
              <input 
              type="text"
              className="form-control" />
            </div>
            <button type="submit" className="btn btn-primary">SUBMIT</button>
          </form>
        </div>
      </div>
    </div>
    )
  }
}

1 JAWABAN / 1 KOMENTAR

User avatar
Bagus Budi Cahyono menjawab pada tanggal 31 July 2020 Jadikan Jawaban Terbaik  Edit  Hapus  Ubah ke Komentar 
Setelah saya cek, respon dari api sekarang sudah berubah,  tidak ada first_name dan last_name, hanya ada name saja.  Jadi silahkan gunakan member.name kak.

Saya edit disini karena sudah tidak bisa tambah komentar: 
untuk mengecek response dari API, langsung saja buka browser dan akses url berikut : 
http://reqres.in/api/user?page=2

Comment ..

maaf kak untuk cheknya gimana emng kak

Dikomentari pada tanggal 2 August 2020 oleh Gelar Rahadian Fajar Edit  Remove