why am i keep getting this setstate is not a function?

Question

my problem is that I keep getting an error "setState is not a function"

class UserLogin extends Component {

    state = {
        fullName: '',
        password: '',

        loader: false,
        success: false,
        fail: false
    }

    // update state with input value
    handleChange = (e) => {
        this.setState({ [e.target.name]: e.target.value });
    }

    handleSubmit = (e) => {
        e.preventDefault();

        const fullName = this.state.fullName;
        const password = this.state.password;
        this.setState = ({ loader: true })

        axios.post(`https://jsonplaceholder.typicode.com/users`, { fullName, password })
            .then(res => {
                console.log(res.data);
                this.setState({ loader: false, success: true })
            })
            .catch(error => {
                console.log(error)
                this.setState({ loader: false, fail: true })
            })
    }

    render() {
        return (
            <div>
                <div>
                    <h1>Sign in</h1>

                        <input
                            name="fullName"
                            onChange={this.handleChange}
                            value={this.state.fullName}
                        />

                        <input
                            name="password"
                            onChange={this.handleChange}
                            value={this.state.password}
                        />

                    <button onClick={this.handleSubmit}>Login</button>
                </div>
            </div>
        );
    }
}

export default UserLogin;

my attempts to solve this was trying to bind things according to similar answers here, or adding a constructor but still only the input values are being updated and the fail, success, and loader in the state are still remaining false.

Does this answer your question? [How does the "this" keyword work?](https://stackoverflow.com/questions/3127429/how-does-the-this-keyword-work) — Jared Smith, Mar 30 '20 at 00:05

score 1 · Accepted Answer · answered Mar 30 '20 at 00:06

1

Looks like this.setState = ({ loader: true }) is supposed to be this.setState({ loader: true }), you're reassigning it so it's not a function anymore.

answered Mar 30 '20 at 00:06

Xetera

1,390
1
10
17

why am i keep getting this setstate is not a function?

1 Answers1