reactjs - react ajax request using axios -


i'm using axios make ajax request. i'm newbie making ajax request , not understanding why code isn't working? have deleted code has nothing question on why not working. error showing "get https://api.github.com/users/$%7bthis.state.usersname%7d 404 (not found)". maybe i'm writing request wrong in url part...

import react 'react'; import reactdom 'react-dom'; import './index.css'; import app './app'; import registerserviceworker './registerserviceworker'; import axios 'axios';  const card = (props) => {     return(         <div style={{margin: '1em'}}>             <img src={props.avatar_url} width="120px"/>             <div>                 <div>{props.name}</div>                 <div>{props.company}</div>             </div>         </div>     );  };  const cardlist= (props) => {     return(         <div>             {props.card.map( card => <card {...card}/>)}         </div>      ); };  class myform extends react.component{     state = { username: '' }     handlessubmit = (event) => {         event.preventdefault();         console.log('event: form submitted:', this.state.username);         axios.get("api.github.com/users/" + this.state.username ).then(response => {             console.log(response);         })      };     render(){         return(             <form onsubmit={this.handlessubmit}>                 <div style={{margin: '1em'}}>                     <input type="text" placeholder="@github"                                 value={this.state.username}                                 onchange={(event) => this.setstate({ username: event.target.value})}/>                     <button type="submit">search</button>                 </div>             </form>         );     }; };  class myapp extends react.component{     render(){         return(             <div>                 <myform />                 <cardlist card={data} />             </div>         );     }; };  let data = [     {         avatar_url: "https://avatars2.githubusercontent.com/u/35?v=4",         name: "kevin williams",         company: "oracle"     },     {         avatar_url: "https://avatars2.githubusercontent.com/u/36?v=4",         name: "dave fayram",         company: "udacity, inc"     } ]  reactdom.render(     <myapp />,     document.getelementbyid('root')   ); 

you trying use template literal using wrong qoute template literal

or can concatenate string:

template literal: `http://api.github.com/users/${this.state.username}

or contatenate string 'http://api.github.com/users/' + this.state.username'

and don't see import or declare card component, yes observation


Comments

Popular posts from this blog

ZeroMQ on Windows, with Qt Creator -

unity3d - Unity SceneManager.LoadScene quits application -

python - Error while using APScheduler: 'NoneType' object has no attribute 'now' -