使用axios响应ajax请求

我正在使用axios发出ajax请求。我是一个提出ajax请求的新手，但不理解为什么这段代码不起作用？我删除了一些代码，这些代码与为什么它不工作的问题无关。显示的错误是找不到GET$%7Bthis.state.usersName%7D 404。也许我在url部分写错了请求

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';
import axios from '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')  
);

---

您试图使用模板文字，但使用了错误的qoute

或者您可以连接字符串：

模板文字：`${this.state.userName}

或 重叠字符串'http://api.github.com/users/“+this.state.userName”

---

我看不到您在哪里导入或声明卡组件，是的，一个观察值是一个“页面未找到错误”，所以检查urlnope它也不起作用。。我甚至试着把它放到一个变量中，但是没有用。你在获取配置文件时使用的是usersName，但是userName在state中，但这不重要。我之所以把它放在状态中，是因为我可以用反应的方式来做，因为我同时在dom上输入它。我正在遵循一个指南，视频也正是以同样的方式进行的，而且很有效。视频和我的代码之间的唯一区别是他在不同的在线编辑器上做的。