Javascript Can'；设置状态数据

我是一个新的反应编程。这可能是一个愚蠢的错误，但我无法访问智能组件中的状态数据

下面是我的代码

import React, { Component } from 'react';

class App extends Component {
    constructor() {
        super();

        this.state = { 
            resData: [], 
        }
    }

    componentDidMount() {
        fetch(`http://someurl.com/something`)
        .then(response => response.json())
        .then(result => { alert(result.data[0].title); this.setState({ resData: result.data }));

    }

    render() {
        return (
            <div>
                <Header />
                <ErrorBoundary>
                    <Content data={ this.state.resData } />
                </ErrorBoundary>
                <Footer />
            </div>
        );
    }

export default App;

我想将此状态数据传递给我的组件。但是，没有数据

<Content data={ this.state.resData } />

任何帮助都将不胜感激

现在试试： 您需要将此关键字与setState（）一起使用

import React，{Component}来自'React'；
类应用程序扩展组件{
构造函数（）{
超级（）；
此.state={
resData:[]，
} 
}
componentDidMount（）{
取回(`http://someurl.com/something`)
.然后（功能（响应）{
返回response.json（）
})
.然后（函数（结果）{
this.setState（{resData:result.data}）
})
.catch（函数（错误）{
警报（“用户名密码不匹配”）
})
}
render（）{
const{resData}=this.state；
返回(
{resData&&
}
);
}
导出默认应用程序；
现在检查一下

警报在设置状态结束前运行，请尝试将警报作为对设置状态的回调运行：

componentDidMount() {
        fetch(`http://someurl.com/something`)
        .then(response => response.json())
        .then(result => this.setState({ resData: result.data }), () => {
          alert(this.state.resData);
        });
    }

---

试试这个也许会有帮助

     import React, { Component } from 'react';

        class App extends Component {
            constructor() {
                super();

                this.state = { 
                    resData: [], 
                }
            }

            componentDidMount() {
    var that = this;
                fetch(`http://someurl.com/something`)
                .then(response => response.json())
                .then(result => { alert(result.data[0].title); that.setState({ resData: result.data }));

    alert(that.state.resData);
            }

            render() {
var that = this;
                return (
                    <div>
                        <Header />
                        <ErrorBoundary>
                            <Content data={ that.state.resData } />
                        </ErrorBoundary>
                        <Footer />
                    </div>
                );
            }

        export default App;

import React，{Component}来自'React'；
类应用程序扩展组件{
构造函数（）{
超级（）；
this.state={
resData:[]，
}
}
componentDidMount（）{
var=这个；
取回(`http://someurl.com/something`)
.then（response=>response.json（））
.then（result=>{alert（result.data[0].title]）；that.setState（{resData:result.data}））；
警报（that.state.resData）；
}
render（）{
var=这个；
返回(
);
}
导出默认应用程序；

Well

.then（result=>setState（{resData:result.data}））；

仅在HTTP请求完成时发生；

alert（）

调用在此之前很久就发生了。在智能组件中，应调用this.props.data.length？this.props.data[0].title我认为问题在于：在内部，这不是组件作用域，而是lambda函数。如果控制台显示this或seState未定义，请检查控制台。@cutiko不，this或setstate没有类似的未定义。抱歉，它什么也没做。alert（this.state.resData）仍将为您提供[]由于您正在记录异步收集的值，因此在发出警报时该字段未填充。使用this.setState将起作用并填充您的状态。如果您想直接使用setState，您必须从

this

解构setState，如

const{setState}=this

；只需执行

console.log即可（this.state.resData）

在

render（）

的第一行中，您应该看到一个

未定义的

，后面是您的实际数据检查：。然后（result=>this.setState（{resData:result.data}））；@ShivaKumarN我试图在render的第一行中控制台.log（this.state.resData）。它显示了[object]。如何将该数据传递给组件？我的目的不是通知数据。我想传递组件。我知道这是您的目的，但如果数据正在记录，则应将其传递给组件。如果您将警报作为对setState的回调运行，您是否会返回数据？将类似这样的数据传递给新组件，并在新组件中使用this.pro私人数据

componentDidMount() {
        fetch(`http://someurl.com/something`)
        .then(response => response.json())
        .then(result => this.setState({ resData: result.data }), () => {
          alert(this.state.resData);
        });
    }

     import React, { Component } from 'react';

        class App extends Component {
            constructor() {
                super();

                this.state = { 
                    resData: [], 
                }
            }

            componentDidMount() {
    var that = this;
                fetch(`http://someurl.com/something`)
                .then(response => response.json())
                .then(result => { alert(result.data[0].title); that.setState({ resData: result.data }));

    alert(that.state.resData);
            }

            render() {
var that = this;
                return (
                    <div>
                        <Header />
                        <ErrorBoundary>
                            <Content data={ that.state.resData } />
                        </ErrorBoundary>
                        <Footer />
                    </div>
                );
            }

        export default App;