Accepted answer

You need to tell Typescript that your object will have one or more property from IAddPlayerFormState, but not necessarily all properties. You can do it like this:

public onChange(event: { target: { name: any; value: any; }; }) {
  const newState = { [name]: value } as Pick<IAddPlayerFormState, keyof IAddPlayerFormState>;
  console.log("On Change!");


All u need to do is specify which item you want to update/change

type ItemState = {
    value?: string;// The state I want to update

#In your case would be

this.setState({playerName : new_value});


Your state shape is this:

interface IAddPlayerFormState {
  playerName: string;
  isDisabled: boolean;

and you are calling setState with this:

{any: any}

You can change only values: playerName and isDisabled not any. If you rewrite function signature as

public onChange(event: { target: { name: "playerName"|"isDisabled"; value: any; }; })

or better

public onChange(event: { target: { name: keyof IAddPlayerFormState ; value: any; }; })

it should be ok for typescript. Btw this code will not work though. Change input name :). I hope this answer is clear, if not i will edit that.


Using this syntax got rid of the error for me:

const myFunction = (e) => {
    return this.setState({...this.state, []:});

Related Query

More Query from same tag