Para habilitar a edição do registro, passe o ID do registro e o nome da API do objeto correspondente a ser editado. Especifique os campos que deseja incluir no layout de edição de registro usando lightning-input-field. Crie um componente Lightning Web usando o comando SFDX abaixo
|
1
|
sfdx force:lightning:component:create —type lwc —componentname recordeditform —outputdir force–app\main\default\lwc
|
Use o código recordeditform.html abaixo
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
<template>
<lightning–record–edit–form record–id={recordId} object–api–name=“Contact”
onsuccess={handleSuccess} onsubmit ={handleSubmit} >
<lightning–messages>
</lightning–messages>
<lightning–output–field field–name=“AccountId”>
</lightning–output–field>
<lightning–input–field field–name=“FirstName”>
</lightning–input–field>
<lightning–input–field field–name=“LastName”>
</lightning–input–field>
<lightning–input–field field–name=“Email”>
</lightning–input–field>
<lightning–button class=“slds-m-top_small” variant=“brand” type=“submit” name=“update” label=“Update”>
</lightning–button>
</lightning–record–edit–form>
</template>
|
Use o código recordeditform.js abaixo
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
import {
LightningElement,
api
} from ‘lwc’;
export default class Recordeditform extends LightningElement {
@api recordId;
handleSubmit(event) {
console.log(‘onsubmit: ‘+ event.detail.fields);
}
handleSuccess(event) {
const updatedRecord = event.detail.id;
console.log(‘onsuccess: ‘, updatedRecord);
}
}
|
Use o código recordeditform.js-meta.xml
|
1
2
3
4
5
6
7
8
|
<?xml version=“1.0” encoding=“UTF-8”?>
<LightningComponentBundle xmlns=“http://soap.sforce.com/2006/04/metadata” fqn=“helloWorld”>
<apiVersion>45.0</apiVersion>
<isExposed>true</isExposed>
<targets>
<target>lightning__RecordPage</target>
</targets>
</LightningComponentBundle>
|
Empurre as alterações e você poderá ver a tela abaixo e poderá editar o registro do contato
