Question

如何使状态和数组一致地工作？

结果是如此混乱和不一致。

这是状态：

 this.state = {
            tutorSubjects: [],

        };

这是设置状态；第一个console.log将主题记录在一个数组中，第二个log和空数组：

            const name = target.name;
            if (name === "tutorSubjects") {
                let subjects = this.state.tutorSubjects.concat(value);
                console.log(subjects)
                this.setState({
                    tutorSubjects: subjects
                },  console.log(this.state.tutorSubjects))
            }

这处理提交并将主题记录为字符串，但不包含数组：

    handleSubmit = e => {
        console.log(this.state.tutorSubjects)
}

我的主要目标是向服务器发送一个数组，现在它正在发送一个字符串。

我不知道为什么，但是现在我将状态更改为subjects并更新了如下所示的状态，它可以正常工作。

            if (name === "tutorSubjects") {
                let subjects = this.state.subjects.concat(value);
                console.log(subjects)
                this.setState({
                    subjects
                }, console.log(this.state.subjects))
            }

Answer 1

setState的callback参数应该是一个 callback函数，但是您并没有提供它，而是立即评估console.log(...)并显示该在 setState被调用之前。

通过确保在之后运行

来修复它：

this.setState({ subjects }, () => console.log(this.state.subjects));

您的原始代码大致等同于：

let v = console.log(this.state.subjects);
this.setState({ subjects }, v);

用这种方式表达的地方显然是混乱的。

数组类型变量更改为setState

1 个答案: