Typescript Observable创建新对象而不是更新

我有一个名为componentGroupsObservable的可观察数组。该数组包含一个ComponentGroup，其中包含一个组件映射，例如：

 [ [ 0:SpriteComponent, 1:AudioComponent ], [ 0:SpriteComponent, 1:AudioComponent ] ]

目标是这些组件将用于游戏对象，例如，当精灵组件更改其纹理时，游戏对象也将更改其纹理

所以我所做的就是将SpriteComponent转换成一个可观察的SpriteData。然后我将其交给spritendercomponent，它将订阅SpriteData并在浏览器中渲染sprite

现在，当我尝试更改纹理时，它会创建一个新的SpriteData/SpriteEnderComponent，而不是使用新纹理更新当前sprite

我对rx仍然缺乏经验，我不知道为什么会发生这种情况

有人能帮我解决这个问题吗

场景：

  constructor(name: string, buildContext: BuildContext, game: Game) {
    super(buildContext, new SceneData(name, true), true, game);

    this._objects = new Array<GameObject>();


    this.componentGroupsObservable.subscribe((groups) => {
      groups.forEach((group) => {
        let gameObject: GameObject = new GameObject(buildContext, "");

        this._objects.push(
          (gameObject = new GameObject(buildContext, group.name))
        );
        group.allComponentData.forEach((component) => {
          const stringifiedComponent = JSON.stringify(component.toJSON());

          switch (component.type) {
            case ComponentModelType.spriteComponent:
              const spriteData = SpriteData.fromJSON(stringifiedComponent);

              const observableSpriteData = new Observable<SpriteData>((subscriber) => {
                subscriber.next(spriteData);
              });

              gameObject.addComponent(
                new SpriteRendererComponent(
                  buildContext,
                  gameObject,
                  observableSpriteData
                )
              );
              break;
            case ComponentModelType.audioComponent:
              break;
            default:
              break;
          }
        });
      });
    });

    this._objects.forEach((object) => {
      this.addGameObject(buildContext, object);
    });
  }

constructor（名称：string，buildContext:buildContext，游戏：game）{
super（buildContext，newscenedata（name，true），true，game）；
这是。_objects=new Array（）；
this.componentGroupsBServable.subscribe（（组）=>{
groups.forEach（（组）=>{
让gameObject:gameObject=newgameobject（buildContext，“”）；
这是(
（gameObject=新的gameObject（buildContext，group.name））
);
group.allComponentData.forEach（（组件）=>{
const stringifiedComponent=JSON.stringify（component.toJSON（））；
开关（组件类型）{
案例组件ModelType.spriteComponent：
常量spriteData=spriteData.fromJSON（stringifiedComponent）；
const observesPriteData=新的可观测（（订户）=>{
订户。下一个（spriteData）；
});
gameObject.addComponent(
新型喷水器组件(
构建上下文，
游戏对象，
可观测数据
)
);
打破
案例组件ModelType.audioComponent：
打破
违约：
打破
}
});
});
});
此._objects.forEach（（object）=>{
this.addGameObject（buildContext，object）；
});
}

SpriteData：

 constructor(
    name: string,
    imgFileName: string = "~/noTextureURL.jpg",
    imageSize: number = 1,
    pivot: mono.ScreenPosition = new mono.ScreenPosition({ x: 0.5, y: 0.5 } as mono.Point),
    scale: mono.ScreenPosition = new mono.ScreenPosition({x:1,y:1} as mono.Point),
    zIndex: number = 0,
    enabled: boolean = true
  ) {
    this.name = name;
    this.type = "spriteRendererComponent";
    this.textureURL = imgFileName;
    this.width = 1;
    this.height = 1;
    this.imageSize = imageSize;
    this.pivot = pivot;
    this.scale = scale;
    this.zIndex = zIndex;
    this.isEnabled = enabled;
  }

  static fromJSON(json: string): SpriteData {
    let valuesMap: Map<string, string> = new Map(
      Object.entries(JSON.parse(json))
    );
    let newItem: SpriteData = new SpriteData(valuesMap.get("name")!);
    newItem.name = valuesMap.get("displayName")!;
    newItem.zIndex = parseFloat(valuesMap.get("zIndex")!);
    newItem.width = parseFloat(valuesMap.get("width")!);
    newItem.height = parseFloat(valuesMap.get("height")!);
    newItem.alpha = parseFloat(valuesMap.get("alpha")!);
    newItem.textureURL = valuesMap.get("textureURL")!;
    newItem.imageSize = parseFloat(valuesMap.get("imageSize")!);
    newItem.tint = Color.fromString(valuesMap.get("tint")!);
    newItem.isEnabled = JSON.parse(valuesMap.get("isEnabled")!);
    return newItem;
  }

构造函数(
名称：string，
imgFileName:string=“~/noTextureURL.jpg”，
imageSize:number=1，
pivot:mono.ScreenPosition=新的mono.ScreenPosition（{x:0.5，y:0.5}作为mono.Point），
scale:mono.ScreenPosition=新的mono.ScreenPosition（{x:1，y:1}作为mono.Point），
zIndex:number=0，
已启用：布尔值=真
) {
this.name=名称；
this.type=“spritendercomponent”；
this.textureURL=imgFileName；
这个宽度=1；
这个高度=1；
this.imageSize=imageSize；
this.pivot=pivot；
这个比例=比例；
this.zIndex=zIndex；
this.isEnabled=已启用；
}
静态fromJSON（json:string）：SpriteData{
让值映射：映射=新映射(
Object.entries（JSON.parse（JSON））
);
let newItem:SpriteData=newspritedata（valuesMap.get（“name”）；
newItem.name=valuesMap.get（“displayName”）！；
newItem.zIndex=parseFloat（valuesMap.get（“zIndex”）；
newItem.width=parseFloat（valuesMap.get（“width”）；
newItem.height=parseFloat（valuesMap.get（“height”）；
newItem.alpha=parseFloat（valuesMap.get（“alpha”）；
newItem.textureURL=valuesMap.get（“textureURL”）！；
newItem.imageSize=parseFloat（valuesMap.get（“imageSize”）；
newItem.tint=Color.fromString（值map.get（“tint”）；
newItem.isEnabled=JSON.parse（valuesMap.get（“isEnabled”）；
返回新项目；
}

喷洒器组件：

  constructor(
    buildContext: BuildContext,
    gameObject: GameObject,
    data: SpriteData | Observable<SpriteData>,
  ) {
    super(buildContext, gameObject);

    if (data instanceof SpriteData) {
      this.spriteAdapter = buildContext.renderContext.renderWorld.createSprite(buildContext.renderContext, data);
    } else {
      this._subscription = data.subscribe((x) => {
        this.spriteAdapter?.destroy();
        this.spriteAdapter = buildContext.renderContext.renderWorld.createSprite(buildContext.renderContext, x);
      });
    }

构造函数(
buildContext:buildContext，
游戏对象：游戏对象，
数据：SpriteData |可观察，
) {
超级（构建上下文、游戏对象）；
if（SpriteData的数据实例）{
this.spriteAdapter=buildContext.renderContext.renderWorld.createSprite（buildContext.renderContext，数据）；
}否则{
此._订阅=数据.订阅（（x）=>{
这个.spriteAdapter？.destroy（）；
this.spriteAdapter=buildContext.renderContext.renderWorld.createSprite（buildContext.renderContext，x）；
});
}