LWC and async functions

A before and after that you don't like.
<template>
<lightning-card icon-name="action:new_account" title="Create Account">
<div slot="actions">
<lightning-button
class="slds-m-top_small"
onclick={handleCreate}
label="Create">
</lightning-button>
</div>
<div class="slds-p-around_small">
<lightning-layout multiple-rows>
<lightning-layout-item size="12">
<lightning-input type="text"
label="Account Name"
name="accountName"
required
onchange={handleChange}
value={accountName}></lightning-input>
</lightning-layout-item>
</lightning-layout>
</div>
</lightning-card>
</template>
import {LightningElement} from 'lwc';
import { createRecord } from 'lightning/uiRecordApi';
import ACCOUNT_OBJECT from '@salesforce/schema/Account';
import ACCOUNT_NAME_FIELD from '@salesforce/schema/Account.Name';

export default class CreateAccountAsync extends LightningElement {
accountName;
isLoading;

async handleCreate(){
const inputFields = this.template.querySelectorAll('lightning-input');

const allValid = this.checkFieldsValidity(inputFields);

if(allValid){
this.isLoading = true;

const fields = {};
fields[ACCOUNT_NAME_FIELD.fieldApiName] = this.accountName;
const accountInput = { apiName: ACCOUNT_OBJECT.objectApiName, fields };

try{
const createRecordResult = await createRecord(accountInput);
console.log('account created with id: ', createRecordResult.id);
}catch (error) {
console.log('error', error);
}


this.isLoading = false;
}
}

checkFieldsValidity(fields){
const allValid = [...fields].reduce((validSoFar, field) => {
return validSoFar && field.reportValidity();
}, true);

return allValid;
}

handleChange(event){
if(event.target.name === "accountName"){
this.accountName = event.target.value;
}
}
}
const fields = {};
fields[ACCOUNT_NAME_FIELD.fieldApiName] = this.accountName;

const accountInput = { apiName: ACCOUNT_OBJECT.objectApiName, fields };
createRecord(accountInput)
.then(result => {
console.log('account created with id: ', result.id);
})
.catch(error => {
console.log('error', error);
});
const fields = {};
fields[ACCOUNT_NAME_FIELD.fieldApiName] = this.accountName;

const accountInput = { apiName: ACCOUNT_OBJECT.objectApiName, fields };
try{
const createRecordResult = await createRecord(accountInput);
console.log('account created with id: ', createRecordResult.id);
}catch (error) {
console.log('error', error);
}

this.isLoading = false;
async handleCreate(){
...
}
try{
const createRecordResult = await createRecord(accountInput);
console.log('account created with id: ', createRecordResult.id);
}catch (error) {
console.log('error', error);
}
@AuraEnabled
public static String integrateAccount(String accountId){
//do your API call here.
Datetime targetDate = System.now().addSeconds(5);

while(System.Now() < targetDate){

}

return 'ok';
}
import integrateAccount from '@salesforce/apex/createAccountController.integrateAccount';
const fields = {};
fields[ACCOUNT_NAME_FIELD.fieldApiName] = this.accountName;
const accountInput = { apiName: ACCOUNT_OBJECT.objectApiName, fields };

try{
const createRecordResult = await createRecord(accountInput);
console.log('account created with id: ', createRecordResult.id);

const integrationResult = await integrateAccount({ accountId: createRecordResult.id });
console.log('success!', integrationResult);

}catch (error) {
console.log('error', error);
}
import {LightningElement} from 'lwc';
import { createRecord } from 'lightning/uiRecordApi';
import integrateAccount from '@salesforce/apex/createAccountController.integrateAccount';
import ACCOUNT_OBJECT from '@salesforce/schema/Account';
import ACCOUNT_NAME_FIELD from '@salesforce/schema/Account.Name';

export default class CreateAccountAsync extends LightningElement {
accountName;
isLoading;

async handleCreate(){
const inputFields = this.template.querySelectorAll('lightning-input');

const allValid = this.checkFieldsValidity(inputFields);

if(allValid){
this.isLoading = true;

const fields = {};
fields[ACCOUNT_NAME_FIELD.fieldApiName] = this.accountName;
const accountInput = { apiName: ACCOUNT_OBJECT.objectApiName, fields };

try{
const createRecordResult = await createRecord(accountInput);
console.log('account created with id: ', createRecordResult.id);

const integrationResult = await integrateAccount({ accountId: createRecordResult.id });
console.log('success!', integrationResult);
}catch (error) {
console.log('error', error);
}

this.isLoading = false;
}
}

checkFieldsValidity(fields){
const allValid = [...fields].reduce((validSoFar, field) => {
return validSoFar && field.reportValidity();
}, true);

return allValid;
}

handleChange(event){
if(event.target.name === "accountName"){
this.accountName = event.target.value;
}
}
}

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Marco Almodova

Marco Almodova

97 Followers

Lead Salesforce Developer, Lightning Champion, 21x Salesforce Certified.