auto-dev-vscode Ts插件层与React页面之间的通讯实现方法

[a793181018]

                                          Ts插件层与React页面之间的通讯

由于插件层和React层存在隔离所以二者不能直接Call，只能通过通讯协议来进行数据交换.
1. 议新增Ts插件层发送给React层的协议

这个文件的路径为:gui-sidebar\src\shims\webviewProtocol.ts ,ReverseWebviewProtocol是Ts插件层发送给React层的协议集，中括号中的第一项写的是React接收到协议内容的数据结构，第二项可能React层的回复Ts插件层的内容数据结构。咱们再看看React层应该如何监听来自Ts插件层的消息如下图

图中的useWebviewListener就是监听来自Ts插件层的方法，参数1是协议key（或者说协议号），参数2是个回调，回调的参数结构就和gui-sidebar\src\shims\webviewProtocol.ts中"WorkspaceService_GetDataStorage"后接中括号中第一项的数据结构一致，由于本人也是第一次使用成功，所以数据结构直接采用了string，由于不确定第二项的作用所以模仿已有的代码写了个viod.
再来看看怎么使用协议发送数据如下图

这个文件的路径为src\editor\views\chat\continue\continueViewProvider.ts，使用ContinueViewProvider.send方法发送，参数1是协议key(协议号)，参数2协议内容,我这里用string作为操作
2.新增React层发送给Ts插件层的协议

如上图，这个文件的路径为:gui-sidebar\src\shims\webviewProtocol.ts ,WebviewProtocol是React层发送给的ts插件层协议集，再看看怎么使用这些协议，如下图

ideRequest方法的功能是把React层的数据发送给的ts插件层，参数1是协议key（协议号）
参数2是协议内容，这里用string来进行操作.再来看看ts插件层如何监听这些协议

如上图，这个文件的路径为src\editor\views\chat\continue\continueViewProvider.ts 途中的case就是监听的协议key(协议号)以及处理实例

上图中的内容大概是协议的数据结构对，用来表示收发的数据结构（自己猜测的）