In this blog post we will learn "How to pass parameter from LWC to apex controller?".
wireaFunctionExample.html
<template>
<div >
<lightning-input
type="text" label="Enter Account Name" value={accName}
onchange={handleChange}> </lightning-input>
<p>Displaying Account
Information</p>
<template
if:true={accountRecord}>
<template
for:each={accountRecord} for:item="item"
for:index="index">
<p key={item.Id}>
Name: {item.Name}
</p>
</template>
</template>
<template if:true={error}>
Some error occured.
</template>
</div>
</template>
wireaFunctionExample.js
import {
LightningElement,wire,track,api } from 'lwc';
import getAccountData from
'@salesforce/apex/getAccountRecord.getAccountRecordMethod';
export default class
WireaFunctionExample extends LightningElement {
@api accName;
@track accountRecord;
@track error;
handleChange(event){
const userInput = event.target.value;
this.accName= userInput;
}
@wire(getAccountData,{ accNameParamInApex:
'$accName'})
accountsData({ error, data }) {
if (data) {
//console.log('RecordId
is'+recordId);
this.accountRecord = data;
this.error = undefined;
} else if (error) {
//console.log('Error block');
this.error = error;
this.accountRecord = undefined;
}
}
}
wireaFunctionExample.js-meta.xml
<?xml
version="1.0" encoding="UTF-8"?>
<LightningComponentBundle
xmlns="http://soap.sforce.com/2006/04/metadata">
<apiVersion>50.0</apiVersion>
<isExposed>true</isExposed>
<targets>
<target>lightning__RecordPage</target>
</targets>
</LightningComponentBundle>
getAccountRecord.cls
public with sharing class
getAccountRecord {
@AuraEnabled(cacheable=true)
public static List<Account>
getAccountRecordMethod(String accNameParamInApex) {
String accNameKey =
'%'+accNameParamInApex+'%';
List<Account> accList=[SELECT Id,
Name, Industry
FROM Account
Where name Like: accNameKey];
return accList;
}
}
testLWCCompApp.app
<aura:application>
<c:wireaFunctionExample></c:wireaFunctionExample>
</aura:application>
OUTPUT:
No comments:
Post a Comment