javascript - React TypeError : this. setState 不是函数

Question

目前我正在编写一个与 .NET Core Web api 一起使用的 React 应用程序，我得到:

TypeError: this.setState is not a function

我将在最后一段中准确地解释何时出现此错误

现在 View 的工作方式如下，在页面上我有一个表，其中包含从 JSON 数据数组中播种的数据以及旁边的几个输入。当我单击表行时，它会将行数据放入输入中，我可以从此处编辑数据。有两个函数正在处理这个问题，第一个是:editData正在向 api 发送 POST 请求，然后修改数据库中已编辑的对象。完成此请求后，第二个功能:getData应运行并使用新的、编辑过的数据刷新表。其外观如下:

构造函数:

class SomeClass extends React.Component {
    constructor(props) {
        super(props);
        this.props = props;
        this.state = {
            someArray: [],
            tableData1: "",
            tableData2: "",

            validationSummary: [],
            isSubmitting: false
        }
        this.handleChange = this.handleChange.bind(this); //function to handle change on inputs
        this.getData = this.getData.bind(this);
        this.editData= this.editData.bind(this);
    }

获取数据的函数:

    async getData() {
        return fetch("http://localhost:5000/api/somecontroller/getroute")
            .then(response => response.json())
            .then(data => {
                this.setState({
                    someArray: data,
                    tableData1: "",
                    tableData2: "", //clear inputs
                })
            })
    }

最后编辑对象函数:

    async editData() {
        var validationSummary = []

        if (this.state.tableData1 !== "" && this.state.tableData2 !== "") {
            this.setState = {
                validationSummary: [], //clear summary
                isSubmitting: true
            }

            let response = await fetch('http://localhost:5000/api/somecontroller/editroute', {
                method: "POST",
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify({
                    data1: tableData1,
                    data2: tableData2
                })
            });

            if (response.status !== 200) {
                validationSummary.push("Something went wrong")
                this.setState = {
                    validationSummary: validationSummary,
                    isSubmitting: false
                }
            }

            else {
                await this.getData()
            }
        }

        else {
            validationSummary.push("Inputs cannot be empty")
            this.setState = {
                validationSummary: validationSummary,
                isSubmitting: false
            }
        }
    }

问题是，每当我编辑一些数据并将其提交以向 API 发送请求时，网站就会停止，并且我会在 this.setState 上收到前面提到的错误。 getData 中的行功能:

    async getData() {
        return fetch("http://localhost:5000/api/somecontroller/getroute")
            .then(response => response.json())
            .then(data => {
                this.setState({ //getting error here

我读过几个与此类似的其他问题，但每次解决方案都是将函数绑定(bind)到 this在constructor 。但是，正如您在我的代码中看到的，我已经绑定(bind)了 getData和editData功能为this 。我可能不得不提一下，当我删除所有 this.setState 时引用文献 editData功能，页面工作正常，我不再收到任何错误。我对 react 还很陌生，所以我很好奇为什么我会收到此错误，以及如何在不删除 this.setState 的情况下修复此错误引用文献 editData函数，因为我需要它们来显示错误消息。

更新

amrs-tech 的答案解决了我的问题，在 editData改变this.setState = {...}至this.setState({...})让它发挥作用。希望它对将来的人有用!

Answer 1

if (this.setState.tableData1 !== "" && this.setState.tableData2 !== "")

这是不正确的。应该是这样的:

if (this.state.tableData1 !== "" && this.state.tableData2 !== "")