跨流式组件状态同步需通过共享状态源或事件机制实现，而非继承；Setter应作为分发入口，配合原子性更新与统一数据源确保一致性。
跨流式组件实例的状态同步，不能靠“继承”本身实现，因为继承解决的是类结构复用，不是运行时状态联动。真正起作用的是Setter 属性的副作用控制能力——当一个 Setter 被调用时，它不仅能更新自身内部值，还能主动触发广播、写入共享源或通知其他实例。关键在于把 Setter 变成“状态分发入口”，而非仅做本地赋值。
用共享状态源 + 统一 Setter 封装
多个组件不直接互相读写，而是共用同一份底层状态（如一个全局 store 对象、Ref、Svelte store 或 Vue 3 reactive 对象）。每个组件的 Setter 都写入该源，并监听其变化来更新 UI：
- 定义一个可响应式的基础状态对象，例如
const sharedState = reactive({ count: 0 }) - 所有组件的
set value(v)都执行sharedState.count = v - 每个组件在
onMounted或connectedCallback中订阅sharedState.count变化，调用render()或触发更新 - 这样任意组件调用 Setter，都会原子性地更新共享源，其余组件自动响应
通过自定义事件桥接 Setter 调用
当无法引入外部状态源时，可用事件机制让 Setter 成为“命令发射点”：
- 在 Setter 内部派发一个带
bubbles: true和composed: true的自定义事件，例如：set value(v) { this._value = v; this.dispatchEvent(new CustomEvent('sync-value', { bubbles: true, composed: true, detail: { value: v } })); } - 所有同级或父级容器监听该事件，收到后调用其他组件的 Setter：
container.addEventListener('sync-value', e => otherComponent.value = e.detail.value) - 适用于轻量级、松耦合场景，但需注意事件监听范围和重复触发风险
利用属性变更回调 + 全局注册表
对基于 Web Components 的流式组件，可结合 attributeChangedCallback 和实例注册表实现隐式同步：
- 所有组件在
connectedCallback中把自己注册进一个全局 Map：CustomElementRegistry.set(this.id || Date.now(), this) - 定义静态
observedAttributes = ['value']，并在attributeChangedCallback中调用this.value = newVal - 当某个组件执行
el.value = 123，先触发自己的 Setter，再通过el.setAttribute('value', '123')向注册表中其他同名逻辑组件广播 - 本质是把 Setter 转为“属性驱动+中心调度”，保证变更可见且可控
避免常见陷阱
原子级同步的前提是操作不可拆分。以下做法会破坏原子性：
- 在 Setter 里异步更新（如 setTimeout、Promise.then），导致读取时机错乱
- 多个 Setter 并行修改不同字段却无锁或事务包装，引发中间态不一致
- 直接操作 Shadow DOM 内部状态而不暴露 setter，使外部无法参与同步链路
- 依赖闭包变量或 this 指向做状态缓存，导致不同实例间实际未共享数据源
