0

I have a flow with a Lightning Web Component. The LWC takes a list or Records as a variable for input and output. The LWC renders a lightning-datatable in which the user may edit various fields of the records, and remove/add records.

I expect the record list variable to be modified after leaving the LWC screen. It IS modified if I create a new record, but the original record cannot be modified.

I have read on docs that the @api annotation makes the variable read-only by wrapping it in a proxy. Then, how can I edit the records?

1

This is demonstrated in lightning-flow-support. To make a variable you can directly modify, use an internally backed variable with getters and setters:

@track _todos = [];

@api // Note: specify only the getter or setter as @api, not both.
get todos() {
    return this._todos;
}

set todos(todos = []) {
    this._todos = [...todos];
}

To notify the Flow Runtime that a value has changed, use the FlowAttributeChangeEvent:

const attributeChangeEvent = new FlowAttributeChangeEvent('todos', this._todos);
this.dispatchEvent(attributeChangeEvent);

You must do this in order for the value to be updated outside the LWC.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.