Skip to content

Instantly share code, notes, and snippets.

@peterknolle
Last active September 18, 2019 01:42
Show Gist options
  • Save peterknolle/3780412dd47d8c0383a56a4858a53715 to your computer and use it in GitHub Desktop.
Save peterknolle/3780412dd47d8c0383a56a4858a53715 to your computer and use it in GitHub Desktop.
Shows the lightning-input-field not working after user input. (1): Click the button and see the lightning-input-field get updated. (2) Manually type something into the lightning-input-field and see it change. (3) Go back and click the button and see the update no longer work.
<template>
<lightning-record-edit-form
object-api-name="Account">
<lightning-input-field
field-name="Name" value={name}></lightning-input-field>
</lightning-record-edit-form>
<lightning-button label="Click to change name" variant="brand" onclick={handleClick}></lightning-button>
</template>
import { LightningElement, track } from 'lwc';
export default class Example extends LightningElement {
@track name = 'a';
handleClick() {
this.name = this.name + 'a';
}
}
@peterknolle
Copy link
Author

peterknolle commented Apr 17, 2019

This is working as designed. From the lightning-input-field documentation:

If a user enters anything in an input field, you can no longer programmatically set the value of the field. The assumption is that there are unsaved changes that should not be overwritten. If you want to be able to overwrite user changes, you can use lightning-input instead.

Why wouldn't it also be assumed that user input collected from a lightning-input are unsaved changes that should not be overwritten? Seems totally arbitrary and a pain that we've lost the metadata-aware lightning-input-field.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment