如何更改表单元格onClick in的背景颜色有大约100个单元格

Question

this is the image.我已经附上了表格的图像。每个单元格上的颜色应该能够动态更改onCLick。如何更改表格单元格onClick in的背景色呢？ 大约有100个细胞。因此，在每个单元格上单击时，将弹出一个模态，您应该能够选择一种颜色。

但是在我的代码中，每个单元格都会改变颜色。这是因为我将背景设置为单一状态。Hw可以动态更改表中不同单元格的状态。

    state = { box1: {visible: false, color: "", text: ""},
box2: {visible: false, color: "", text: ""},
box3: {visible: false, color: "", text: ""},  };

     showModal = () => {
    this.setState({
      visible: true
    });
  };
   boxesChange = (value, text, id) => {
    const box={
            color: value,
            text: text
          };        
    this.setState(
          `${id}`:box,
          () => console.log("this is wt", this.state.color)
        );
      };

     render() {
        const yellow = "yellow";
        const blue = "blue";
        const reenter code hered = "red";
        const text = "colors";

        let s = [1, 2, 3];

        let d = s.map(tables => (
          <div>
            <table
              style={{
                border: "1px solid black",
                width: "70px",
                background: `${this.state.color}`
              }}
            >
              <thead>
                <tr>
                  <td onClick={this.showModal}>{this.state.text}Change 
                   colors
                  </td>
                </tr>
              </thead>
            </table>
          </div>
        ));
     return (
          <div>
            {d}
            <Modal
              title="Basic Modal"
              visible={this.state.visible}
              onOk={this.handleOk}
              onCancel={this.handleCancel}
            >
              <div id="box1" className="boxes" onClick={()=>this.boxes1(yellow,text,id)}>
               YELLOW
              </div>
              <div id="box2" className="boxes" onClick={() => this.boxes2(red,text,id)}>
               RED
              </div>
              <div id="box3" className="boxes" onClick={() => this.boxes3(blue,text,id)}>
               BLUE
              </div>
            </Modal>
          </div>
        );
      }
    }