В этой записи блога мы рассмотрим различные методы реализации функции загрузки файлов в веб-компонентах Lightning (LWC). Мы рассмотрим различные подходы и предоставим примеры кода, которые помогут вам понять и интегрировать возможности загрузки файлов в ваши приложения LWC. Итак, начнем!

Метод 1: использование компонента Lightning-File-Upload
Компонент Lightning-File-Upload — это предварительно созданный компонент, предоставляемый Salesforce, который позволяет легко загружать файлы в LWC. Вот пример того, как его использовать:

<template>
  <lightning-file-upload
    accept=".pdf, .png, .jpg"
    record-id={recordId}
    onuploadfinished={handleUploadFinished}
  ></lightning-file-upload>
</template>

import { LightningElement, api } from 'lwc';
export default class FileUploadExample extends LightningElement {
  @api recordId;
  handleUploadFinished(event) {
    // Handle upload finished logic here
    // Access uploaded files using event.detail.files
  }
}

Метод 2: использование элемента ввода HTML
Вы также можете реализовать функцию загрузки файлов с помощью элемента ввода HTML. Вот пример:

<template>
  <input type="file" onchange={handleFileChange} />
</template>

import { LightningElement } from 'lwc';
export default class FileUploadExample extends LightningElement {
  handleFileChange(event) {
    const file = event.target.files[0];
    // Handle file upload logic here
  }
}

Метод 3. Загрузка файлов на сервер Salesforce с помощью Apex
Если вам необходимо загрузить файлы непосредственно на сервер Salesforce, вы можете использовать Apex для обработки загрузки файлов. Вот пример:

import { LightningElement, wire } from 'lwc';
import { createRecord } from 'lightning/uiRecordApi';
import FILE_OBJECT from '@salesforce/schema/ContentVersion';
export default class FileUploadExample extends LightningElement {
  @wire(createRecord, { objectApiName: FILE_OBJECT })
  createFileRecord({ error, data }) {
    if (data) {
      // Handle successful file upload
    } else if (error) {
      // Handle error
    }
  }
}

В этой записи блога мы рассмотрели несколько методов реализации функции загрузки файлов в веб-компонентах Lightning (LWC). Мы рассмотрели использование компонента Lightning-File-Upload, элемента ввода HTML и загрузку файлов на сервер Salesforce с помощью Apex. Используя эти методы, вы можете расширить свои приложения LWC за счет возможности загрузки файлов, обеспечивая удобство работы с пользователем.

Не забудьте настроить примеры кода в соответствии с вашими конкретными требованиями и настроить обработку ошибок и сообщения об успехе в соответствии с потребностями вашего приложения. Приятного кодирования!