Won't setState with nested state

1

I am trying to update a nested state, so when i click a button i will ether get a 0 or a 1. if I get a zero it means i missed and i need to update the Shots_Taken key value, where as if i get a one I need to update the Shots_Taken and and Score key value, but I cant seem to figure it out. Ive tried just using

this.setState((state)=> {
    Score: this.state.Score + 1
})

and tried

this.setState({
	...this.state.Player_One,
	Score: this.state.Score + 1,
	Shots_Taken: this.state.Shots_Taken + 1,
	Message: 'SCORE!!!!'
});

And none has worked. Here is the full section of code

class Game extends Component {
	constructor(props) {
		super(props);

		this.state = {
			Player_One: {
				Score: 0,
				Shots_Taken: 0,
				Shot_Percentage: 0,
				Message: null
			},
			Player_Two: {
				Score: 0,
				Shots_Taken: 0,
				Shot_Percentage: 0,
				Message: null
			}
		};
	}

	playerOne() {
		console.log('Player One');
		let shot = shoot();
		console.log(shot);
		if (shot === 0) {
			this.setState({
				...this.state.Player_One,
				Score: 0,
				Shots_Taken: this.state.Shots_Taken + 1,
				Message: 'Its a Miss...'
			});
		} else {
			this.setState({
				...this.state.Player_One,
				Score: this.state.Score + 1,
				Shots_Taken: this.state.Shots_Taken + 1,
				Message: 'SCORE!!!!'
			});
		}
	}

	playerOneClickHandler = (evt) => {
		console.log('Clicking');
		this.playerOne();
	};

	render() {
		const { Shots_Taken, Score, Message } = this.state.Player_One;
		return (
			<div>
				<Team
					className="One"
					score={Score}
					count={Shots_Taken}
					message={Message}
					handleClick={this.playerOneClickHandler}
				/>
			</div>
		);
	}
}

Any guidance would be much appreciated

2

Just looking at it, if I wanted to increment Player_One’s score, I would assume I’d have to do:

this.setState({ 
  Player_One: { 
    ...this.state.Player_One, 
    Score: this.state.Player_One.score + 1,
  }
});

or

this.setState(
  previousState,
  { 
    Player_One: { 
      ...previousState.Player_One, 
      Score: previousState.Player_One.score + 1,
    }
  }
);

That’s just off the top of my head, but that makes sense at first glance. You want to change that object so you have to create a new one.

3

It always seem that i am overthinking things
Thank you.