Question

我已经完成并尝试了本教程，但结果相同

当我想使用axios检索API时，结果同样难以辨认。

也许这可能是一个重复的问题，但是我很困惑要完成它。

请帮助

这是我的代码

constructor(){
        super();
        this.state={
            datas:[],
        }
    }
      componentDidMount() {
        axios
          .get('/jobs')
          .then(res => {
            const updatedData = res.datas.map(data => {
              return {
                  ...data
              };
            });
            this.setState({ datas: updatedData, err: null });
            // console.log(response)
          })
          .catch(err => {
            this.setState({ err: true });
          });
      }

并从渲染端

render(){
        let datas = <p style={{textAlign:'center'}}>Something went wrong!</p>

        if(!this.state.err){
           let datas = this.state.datas.map(data => {
                return <Card
                        key={data.id}
                        desription={data.desription}
                        company={data.company}
                        />
            })
        }
        return(
            <div>
                <section>
                    <Navigation/>
                </section>

                <section>
                    <SearchBox></SearchBox>
                </section>

                <section>
                    <Category></Category>
                </section>

                <main>
                    {datas}
                </main>
            </div>
        )
    }

当我调用它时从控制台

here's the image

卡组件图像： from card components

Answer 1

实际错误是什么？在页面上。

，并且res.datas应该为res.data，因为响应中没有datas。

我的帐户受到一些否决问题的阻止，有趣的是，即使我已经接受了答案，我也必须重新编辑它们。我不明白这样做的意义。这个stackoverflow系统。

现在，除了继续编辑我的问题外，我基本上无能为力，并且所有问题都已得到解答。这太荒谬了！！！

无法在ReactJS中使用Axios提取API

1 个答案: