请求协助：实现同输入框内左节点到已连边右节点的数据传输

需求明确 #

在带连接边的布局中，实现左侧节点输入框内容同步到对应右侧节点输入框的功能。

实现步骤（以原生JS为例） #

1. 给每个节点的输入框添加唯一标识，比如data-node-id，用来区分左右节点
2. 维护边的连接关系映射表，记录左侧节点ID对应的右侧节点ID
3. 监听左侧节点输入框的input事件，实时同步内容到右侧对应节点的输入框

示例代码 #

// 模拟边连接关系：左侧节点ID → 右侧节点ID
const nodeLinks = {
  left-node-01: 'right-node-01'
};

// 监听所有节点输入框的输入事件
document.querySelectorAll('.node-input').forEach(input => {
  input.addEventListener('input', function() {
    const currentNodeId = this.dataset.nodeId;
    // 判断当前是否为左侧节点，找到对应右侧节点
    const targetNodeId = nodeLinks[currentNodeId];
    if (targetNodeId) {
      const targetInput = document.querySelector(`.node-input[data-node-id="${targetNodeId}"]`);
      if (targetInput) {
        targetInput.value = this.value;
      }
    }
  });
});

框架场景适配（以Vue为例） #

如果用Vue开发，可通过状态绑定直接实现同步：

<template>
  <div>
    <input v-model="sharedValue" class="left-node-input">
    <!-- 已通过边连接的右侧节点输入框 -->
    <input v-model="sharedValue" class="right-node-input">
  </div>
</template>

<script>
export default {
  data() {
    return {
      sharedValue: ''
    };
  }
};
</script>

原需求描述：我希望在已连接边的同一个输入框内，实现从左侧节点到右侧节点的数据传输，恳请相关人士提供协助。

内容的提问来源于stack exchange，提问作者Ajay Bidhan