绑定 this 后 setState 不是一个函数

2023-12-08

我有一个简单的表单,允许用户创建纯文本帖子。下面的代码生成一个成功的服务器端响应createPostRequest称呼。但是,在成功发布后,我想更新状态以清空 postBody 字段并更新 UI 以反映此更改,然后允许用户发出后续请求以发布其他消息。

目前,仅第一个请求一切正常,并且在成功的初始请求后,postBody 字段不会清空,并且当尝试更改第一个初始请求后的 post 字段的值时,每次击键都会导致以下错误:

Uncaught TypeError: Cannot read property 'setState' of undefined

请注意,有点奇怪的是,尽管绑定,我还是收到了上述错误this到构造函数中的 onChange 方法。

有人遇到过这个问题吗?我很感激任何有关如何解决的建议。

constructor(props) {
        super(props);

        this.state = {
            postBody : "",
            location: "main"
        };

        this.onSubmit = this.onSubmit.bind(this);
        this.onChange = this.onChange.bind(this);
    }

    onChange(e) {
        this.setState({
            [e.target.name] : e.target.value
        });
    }

    onSubmit(e) {
        e.preventDefault();

        this.props.createPostRequest(this.state).then(
            () => {

                this.setState = ({
                    postBody : ""
                });
            }
        )
    }

    render() {

        return (
            <div className="create-post-inner col-md-12">
                <form id="createPost" onSubmit={ this.onSubmit } >
                    <textarea value={this.state.postBody} className="form-control postInput" name="postBody" onChange={ this.onChange } >
                    </textarea>
                    <span>The value of the state is {this.state.postBody}</span>
                    <input type="submit" className="submit btn btn-primary" />
                </form>
            </div>
        );
    }

还有一个额外的=在 this.setState 之后。将以下内容更改为

 this.props.createPostRequest(this.state).then(
        () => {

            this.setState({
                postBody : ""
            });
        }
    )
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

绑定 this 后 setState 不是一个函数 的相关文章

随机推荐