How to create a Reusable Custom Lookup Search Component in Lightning Web Component

Hello to all learners, today we are going to see how to create a reusable custom lookup search component in LWC.

Step 1: Create an Apex Class and name it "CustomLookupSearchController"

This class has a method named as lookupSearch to search the lookup object records and return List<sObject>.

Step 2: Create a Lightning Web Component named "customLookupSearchComponent"

• customLookupSearchComponent.html

• customLookupSearchComponent.js

Now, It's time to test the above component. For that purpose, you can use the above component inside the parent component.

Step 3: Create one more LWC component named "demoCustomLookupSearchComponent".

• demoCustomLookupSearchComponent.html

• demoCustomLookupSearchComponent.js

• demoCustomLookupSearchComponent.js-meta.xml

Let's see it in action.

    

FEATURES: 

1. This component works for both standard and custom objects.
2. You can create, update and delete records using the lookup component as a child component.
3. Display recently viewed records when the focus is on input.

REFERENCES:

https://www.salesforcelwc.in/2019/10/lookup-in-lwc.html

That's all for today. still, if you have any queries, suggestions, and thoughts on this, or if you want me to write a blog on some custom topic then just make sure to comment down and let me know.

Thank You!!