为何combineLatest中并非所有流都发射值？仅data流有输出

问题根源 #

combineLatest的核心规则是：必须所有输入的Observable都至少发射过一次值，它才会输出组合后的结果。你当前只有data$有值输出，sourceWithImage$和sourceWithFields$从未发射过数据，因此combineLatest不会产生任何输出。

无需startWith的解决方案 #

根据业务场景需求，提供两种实用方案：

方案1：以data$为触发源，结合其他流的已有值

如果你只需要在data$发射时，尝试结合其他流已发射的最新值（若其他流未发射，对应字段为undefined），可以使用withLatestFrom：

this.result$ = this.data$.pipe(
  tap(() => console.log('data')),
  withLatestFrom(
    this.sourceWithImage$.pipe(tap(() => console.log('image'))),
    this.sourceWithFields$.pipe(tap(() => console.log('fields')))
  ),
  map(([data, image, fields]) => ({ data, image, fields }))
);

补充：如果希望即使其他流未发射，只要data$有值就输出结果，可以给其他流添加defaultIfEmpty(undefined)：

this.result$ = this.data$.pipe(
  tap(() => console.log('data')),
  withLatestFrom(
    this.sourceWithImage$.pipe(tap(() => console.log('image')), defaultIfEmpty(undefined)),
    this.sourceWithFields$.pipe(tap(() => console.log('fields')), defaultIfEmpty(undefined))
  ),
  map(([data, image, fields]) => ({ data, image, fields }))
);

方案2：实时更新全局状态，任何流发射都同步结果

如果需要任何一个流发射（包括后续sourceWithImage$/sourceWithFields$的首次发射）都更新最终结果，同时保留所有流的最新状态，可以用merge+scan组合：

// 初始化状态（可根据业务需求调整，比如不需要初始值可移除）
const initialState = { data: undefined, image: undefined, fields: undefined };

this.result$ = merge(
  this.data$.pipe(tap(() => console.log('data')), map(data => ({ data }))),
  this.sourceWithImage$.pipe(tap(() => console.log('image')), map(image => ({ image }))),
  this.sourceWithFields$.pipe(tap(() => console.log('fields')), map(fields => ({ fields })))
).pipe(
  // 累积更新状态，保留所有流的最新值
  scan((prevState, update) => ({ ...prevState, ...update }), initialState),
  // 可选：过滤掉还未获取到data的状态（根据业务需求决定是否保留）
  filter(state => state.data !== undefined)
);

该方案的优势：

• 完全不需要使用startWith
• 任何流的发射都会实时更新结果
• 自动维护所有流的最新状态

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