Web组态，通过Vue3+TypeScript+WebSocket技术实现平台仪器间的相互通信，用于设计工业化虚拟仿真。
界面图如下（之前文章有详细教学）
如下是通信设备虚拟仿真的三个仪器，设计初衷是想三个仪器能够数据互通，实现真实模拟效果。
思路：
仪器A发出信号(通过WebSocket技术发送信息给主界面)==》主界面（主界面初始化就建立WebSocket连接，并接收仪器A发出的信息，然后将仪器A发出的信息进行处理，通过传参的方式传递给仪器B、C）=》仪器B、C（接收所传递的参数）
主界面代码如下：关键代码 socket.onmessage接收信息逻辑
onMounted(() => {
connectWebSocket();
});
// 当组件卸载时关闭 WebSocket
onUnmounted(() => {
if (socket) {
socket.close();
}
});
//WebSocket模块
// 连接 WebSocket，并处理接收和发送消息的逻辑
// WebSocket 对象
let socket: WebSocket | null = null;
const connectWebSocket = () => {
socket = new WebSocket('ws://localhost:8667/VirtuLab_back/chat'); // 连接到后端 WebSocket
// WebSocket 打开时触发
socket.onopen = () => {
console.log('主界面：WebSocket 连接已建立');
};
// 接收 WebSocket 消息时触发
socket.onmessage = (event: MessageEvent) => {
const message = JSON.parse(event.data);
const { source, action, data } = message;
if (source === "signalSource" && action === "updateFrequency") {
paneldata.value[0].value = data.frequency;
}
console.log('主界面：WebSocket 对话已建立');
console.log('主界面：接收到信息 '+data)
};
// WebSocket 关闭时触发
socket.onclose = () => {
console.log('主界面：WebSocket 连接已关闭');
};
// WebSocket 出现错误时触发
socket.onerror = (error) => {
console.error('主界面：WebSocket 错误:', error);
};
};仪器A代码，在需要改变数据的时候通过发送信息的方式让所有连接WebSocket的客户端收到信息
const message = {
source: "signalSource", // 来源：信号源
action: "updateFrequency", // 操作：更新频率
data: {
frequency: formattedNumber+"GHz",
}
};主界面传参给仪器B、C
<el-dialog
v-model="DialogVisible"
:title="DialogTitle"
center
:close-icon="CircleCloseFilled"
style="height: 80%; width: 80%; overflow: hidden"
>
<keep-alive>
<component :is="currentPage" :transferData="transferData"/>
</keep-alive>
</el-dialog>
if(node.id=='接收机'){
transferData.value = paneldata.value[0].value
DialogVisible.value = true
currentPage.value = Experiment
DialogTitle.value = "接收机操作"
}仪器B、C接收（传参要定义在onMounted外面，否则会报错）但是目前只能传递一次，因为使用了keep-alive，后续可用仪器B、C也连接WebSocket，或者用pinia进行管理
const props = defineProps<{
transferData: string; // 根据实际数据类型定义
}>();
onMounted(()=>{
console.log(props)
