Cómo actualizar los atributos en búfer desde un Componente Glimmer adjunto a edit-topic

Esta es la plantilla antigua que estoy intentando eliminar y mover a un componente Glimmer

{{#if model.showLocationControls}}
  {{add-location-controls
    location=buffered.location
    categoryId=buffered.category.id
  }}
{{/if}}

Más abajo, simplemente hay un this.set("location", location); que parece exhibir una vinculación bidireccional.

Esto funciona bien.

Acceder al búfer con buffered proporciona la conectividad necesaria para pasar los cambios de ubicación hacia arriba.

El desafío surge al usar un componente Glimmer de reemplazo:

export default class EditLocationDetails extends Component {

  @action
  updateLocation(location) {
    this.args.outletArgs.buffered.location = location;
  }

  <template>
    {{#if this.args.outletArgs.model.showLocationControls}}
      <AddLocationControls
        @location={{this.args.outletArgs.buffered.location}}
        @category={{this.args.outletArgs.buffered.category}}
        @updateLocation={{this.updateLocation}}
      />
    {{/if}}
  </template>
}

Ahora el atributo se puede actualizar, pero no se mantiene, presumiblemente porque es un argumento Glimmer de datos descendentes.

¿Qué me estoy perdiendo?

¿Hay alguna acción a la que pueda acceder que me permita pasar el cambio hacia arriba?

4 Me gusta

OK, esto es lo que parece que me falta.

Explorando el objeto, encontré algunos atributos interesantes, por lo que esta acción se convierte en:

  @action
  updateLocation(location) {
    this.args.outletArgs.buffered.buffer = {
      location: location
    }
    this.args.outletArgs.buffered.hasBufferedChanges = true;
  }

Eso parece que lo soluciona.

Casi nada de eso fue inmediatamente obvio.

Por favor, hazme saber si hay una mejor manera de hacer esto.

4 Me gusta

Hay una forma más elegante de hacer esto y, presumiblemente, es más estándar y está prevista:

  @action
  updateLocation(location) {
    set(this.args.outletArgs.buffered, "location", location);
    this.location = location;
  }
3 Me gusta

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.