3

I am using @api setter to update variable and I receive "invalid reassignment of public property". How can I fix it? I thought problem with my logic and removed everything and nothing is changed. Setter is need for manipulating with data. My code:

_data;


@api set data(value) { 
   this._data = value;
}

renderedCallback() {
   this.data = 'test';
}
3
  • 1
    An LWC should not directly update its API properties. What you can do is update the underlying value, behind the getter/setter pair, such as this._data here. If your setter is to update the internal value and do logic, create a local function that does this and call it from the setter and from your renderedCallback.
    – Phil W
    Commented Dec 13, 2022 at 18:22
  • @PhilW Thanks. So I can't use any api method inside js file?
    – ravipo
    Commented Dec 13, 2022 at 18:27
  • Not inside the same component, no. This goes against the LWC contract for @api.
    – Phil W
    Commented Dec 13, 2022 at 18:29

1 Answer 1

2

An LWC should not directly update its API properties as covered in the documentation:

Using getters and setters ensures that the public API contract is easily enforced. Don’t change the value of a property that’s annotated with @api.

What you can do is update the underlying value, behind the getter/setter pair, such as this._data here.

If your setter is to update the internal value and do logic, create a local function that does this and call it from the setter and from wherever else you need this (here in your renderedCallback).

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .