How to update property of object inside Stimulus-Controller?

In my Controller, I have the following value:

  static values = {
    rating: Object,
  };

Here are the properties of a rating object:

 attractiveness: 3
 innovation: 5
 look: 2

I wanted to update the rating object like this:

  voteAttractiveness(event) {
    this.ratingValue.attractiveness = event.params.ratingValue;
  }

But this doesn’t work. At the moment, I’m doing this as a workaround:

  voteLook(event) {
    let new_rating = this.ratingValue;
    new_rating.look = event.params.ratingValue;
    this.ratingValue = new_rating;
  }

This seems wrong to me.
What is the proper way to update a property inside a Stimulus-Controller?

If you look in the handbook under values → Types there is an list of how it handles encoding and decoding depending on the type: Stimulus Reference

You can see that the setter uses JSON.stringify so you will likely need to update the entire object for it to work as intended.

1 Like