一个单元格存在多个按钮的点击事件问题

如上图一个单元格存在多个按钮，怎么判断点击了按钮1还是按钮2呢；使用command，是可以获取当前点击的事件，但是反系列化后就不执行了。

前面描述不太准确，已在原回答基础上做了更改。
示例请参考下方链接：
https://gcdn.grapecity.com.cn/fo ... hread&tid=82896

按钮执行的command代码逻辑，是您在设计按钮时就已经设置的，
所以要判断是点击的哪个按钮，可以在command中就定义好，比如用一个变量来控制。
”使用command，是可以获取当前点击的事件，但是反系列化后就不执行了。“
这个如何理解，请结合具体的示例详细描述下。
附件为demo模板，您可以在模板基础上添加自己的代码，需要能复现您描述的问题。

Lynn.Dou 发表于 2021-11-18 16:45
按钮执行的command代码逻辑，是您在设计按钮时就已经设置的，
所以要判断是点击的哪个按钮，可以在command ...

react 代码

1. import * as React from 'react';
   
2. import * as ReactDOM from 'react-dom';
   
3. import '@grapecity/spread-sheets-resources-zh';
   
4. GC.Spread.Common.CultureManager.culture("zh-cn");
   
5. import GC from '@grapecity/spread-sheets';
   
6. import { SpreadSheets, Worksheet, Column } from '@grapecity/spread-sheets-react';
   
7. import './styles.css';
   
8. 
   
9. const Component = React.Component;
   
10. 
    
11. function _getElementById(id) {
    
12.     return document.getElementById(id);
    
13. }
    
14. 
    
15. class App extends Component {
    
16.     constructor(props) {
    
17.         super(props);
    
18.         this.spread = null;
    
19.         this.spread2 = null;
    
20.         this.import_noFormula = false;
    
21.         this.import_noStyle = false;
    
22.         this.import_rowHeaders = false;
    
23.         this.import_columnHeaders = false;
    
24.         this.import_donotrecalculateafterload = false;
    
25.         this.noFormula = false;
    
26.         this.noStyle = false;
    
27.         this.SaveCustomRowHeaders = false;
    
28.         this.SaveCustomColumnHeaders = false;
    
29.     }
    
30.     onClickType(){
    
31.         alert(11)
    
32.     }
    
33.     render() {
    
34.         return <div class="sample-tutorial">
    
35.             <div class="sample-spreadsheets-container">
    
36.                 <label style={{ font: 'bold 10pt arial' }}>ToJson:</label>
    
37.                 <div class="sample-spreadsheets">
    
38.                     <SpreadSheets workbookInitialized={spread => this.initSpread(spread)}>
    
39.                         <Worksheet></Worksheet>
    
40.                     </SpreadSheets>
    
41.                 </div>
    
42.                 <br />
    
43.                 <label style={{ font: 'bold 10pt arial' }}>FromJson:</label>
    
44.                 <div class="sample-spreadsheets">
    
45.                     <SpreadSheets workbookInitialized={spread => this.initSpread2(spread)}>
    
46.                         <Worksheet></Worksheet>
    
47.                     </SpreadSheets>
    
48.                 </div>
    
49.             </div>
    
50.             <div className="options-container">
    
51.                 <div style={{ width: '290px' }}>
    
52.                     <label>This serializes the first Spread instance to a JSON object, and then deserializes that object into the second Spread instance.</label>
    
53.                     <div className="option-row">
    
54.                         <input type="button" defaultValue="系列化" id="fromtoJsonBtn" onClick={e => this.serialization(e)} />
    
55.                     </div>
    
56.                 </div>
    
57.             </div>
    
58.         </div>;
    
59.     }
    
60.     initSpread(spread) {
    
61.         this.spread = spread;
    
62.         let sheet = spread.getSheet(0);
    
63.         var spreadNS = GC.Spread.Sheets;
    
64.         sheet.suspendPaint();
    
65.         sheet.setColumnWidth(0, 300);
    
66.          let  style = new GC.Spread.Sheets.Style();
    
67.         style.cellButtons = [
    
68.             {
    
69.                 caption: "按钮1",
    
70.                 buttonBackColor: "#82BC11",
    
71.                   command: (sheet, row, col, option) => {
    
72.                    this.onClickType()
    
73.                 }
    
74.             },
    
75.              {
    
76.                 caption: "按钮2",
    
77.                 buttonBackColor: "#82BC00",
    
78.                   command: (sheet, row, col, option) => {
    
79.                     this.onClickType()
    
80.                 }
    
81.             }
    
82.         ];
    
83.         sheet.setStyle(0, 0, style);
    
84.         sheet.resumePaint();
    
85.     }
    
86.     initSpread2(spread) {
    
87.         this.spread2 = spread;
    
88.     }
    
89.     serialization(e) {
    
90.         //ToJson
    
91.         var spread1 = this.spread;
    
92.         var jsonStr = JSON.stringify(spread1.toJSON());
    
93.         //FromJson
    
94.         var spread2 = this.spread2;
    
95.         spread2.fromJSON(JSON.parse(jsonStr));
    
96.     }
    
97. }
    
98. 
    
99. ReactDOM.render(<App />, _getElementById('app'));
    

复制代码

您cellbutton的command是function，function无法序列化到json中。
如果需要序列化，需要将function内执行的代码逻辑定义给command，
然后将command 的名字string 给cellbutoon，
此时导入json再导入json新的spread中，需要给新spread重新注册command。

Lynn.Dou 发表于 2021-11-18 17:33
您cellbutton的command是function，function无法序列化到json中。
如果需要序列化，需要将function内执行 ...

不是很明白，能写个例子吗

Lynn.Dou 发表于 2021-11-19 09:22
前面描述不太准确，已在原回答基础上做了更改。
示例请参考下方链接：
https://gcdn.grapecity.com.cn/fo ...

可以了，谢谢

您客气了，那本帖就先结贴了，有问题欢迎另开新帖交流。