Как динамически изменить state в react js?

У меня есть главный компонент App, в его state я передал массив объектов, а потом этот массив объектов передал через пропс в state второго компонента, где с помощью метода map я прошёлся по каждом элементы и отрисовал его. Каждый элемент это типо продукт, и каждого продукта есть кнопка. Вопрос в том, как сделать так, чтобы при клике на эту кнопку изменялся state только того продукта, на кнопку которого было нажатие. Буду благодарен за подсказку

Вот главный компонент App:

import React, { Component } from 'react';
import Header from './Components/Header/Header';
import Products from './Components/Products/Products';
class App extends Component{
  constructor(props) {
    super(props)
    this.state = {
      products: [
        {name: "Волшебный корабль", price: 300, id:1},
        {name: "Безумный корабль корабль", price: 320, id:2},
        {name: "Корабль судьбы", price: 350, id:3},
      ]
    }
  }
  render() {
    return (
      <div className="App">
        <Header />
        <Products products={this.state.products} />
      </div>
    );
  }
}
export default App;

А вот компонент, в который я передал массив объектов:

import React, { Component } from 'react';
class Products extends Component {
    constructor(props) {
        super(props)
        this.state = {
            products: props.products,
        }
        this.changeState = this.changeState.bind(this);
    }
    changeState() {
        this.setState(state => ({
            //Тут я так понял что-то нужно изменить 
        }))
    }
    render() {
        let productsArr = this.state.products;
        console.log(productsArr);
        return(
            <div className="Products">
                {productsArr.map(item => {
                    return(
                        <div key={item.id}>
                            <h1>{item.name}</h1>
                            <h2>{item.price}</h2>
                            <button onClick={() => this.changeState()}></button>
                        </div>
                    )
                })}
            </div>
        )
    
    }
}
export default Products;