Skip to main content
3월 5~6일에 샌프란시스코의 TDX 또는 Salesforce+에서 열리는 AI 에이전트 시대를 위한 개발자 컨퍼런스에 참여하세요. 지금 등록하기.

Get Hands-on with Lightning-Record-Picker

Learning Objectives

After completing this unit, you’ll be able to:

  • Implement and configure the lightning-record-picker.
  • Search for records with the lightning-record-picker component.

The lightning-record-picker component allows users to quickly find and select Salesforce records. You learn how to configure the component’s behavior and presentation, plus enable filtering so that users can retrieve and display the records they want. For the hands-on challenge, you use the component in a playground org to provide an additional way for customers to search inventory.

Search for Records with the Lightning-Record-Picker Component

Use the lightning-record-picker component in a Salesforce application so that desktop and mobile users can quickly find and select Salesforce records. Configure the component’s behavior and presentation, and enable filtering so that users can retrieve and display precisely the records that they want. This feature, now generally available, includes some changes since the previous release. You can now retrieve up to 100 records whereas previously, it was 50 records. The component also displays clear error messages when you configure invalid specifications and supports new attributes. This component uses the GraphQL wire adapter, which enables offline use.

Where: This feature is available for Lightning Experience in all editions.

How: Here’s an example to get started with the lightning-record-picker component. The component attributes provide the label for the input field, the object to search, and a callback to handle the selection of a record.

<lightning-record-picker
    label="Select a record"
    placeholder="Search..."
    object-api-name="Contact"
    value={initialValue}
    onchange={handleChange}
></lightning-record-picker>

Here’s what the example looks like in the UI.

UI implementation of the code.

Providing a record ID to thevalue attribute makes the record picker component display a default selected record.

UI displays the value for the record ID as Michael Jones.

In this unit, you learned how the lightning-record-picker allows users to find and select records and how you can tailor the component’s behavior and presentation. Now, you apply your knowledge of the lightning-record-picker component in a practical case involving a customer search in your boat inventory.

실습 과제

+500 포인트

준비

실무 조직에서 이 유닛을(를) 완료하게 됩니다. Launch(실행)를 클릭하여 시작하거나 조직 이름을 클릭하여 다른 항목을 선택하세요.

내 과제

Review updates to Salesforce to maintain your JavaScript Developer I Certification.
Implement and configure a lightning-record-picker component.

If you haven’t already completed unit 2, do that now. Otherwise, you won't be able to complete this challenge.
  • Update the boatPicker component
    • Configure the picker to display boat name as the main field and type as an additional field.
    • Configure the picker to search boat name as the main field and type as an additional field.
    • Configure the picker to change which boat is displayed when the selected record is changed.
  • To ensure the component is working as expected, deploy the boatPicker to the homepage of the Lightning Service application.
Salesforce 도움말에서 Trailhead 피드백을 공유하세요.

Trailhead에 관한 여러분의 의견에 귀 기울이겠습니다. 이제 Salesforce 도움말 사이트에서 언제든지 새로운 피드백 양식을 작성할 수 있습니다.

자세히 알아보기 의견 공유하기