www.dextsolution.com
DEXTUPLOAD
X5
React Reference > DEXTUploadX5UI(List/Tile/Single/Grid)

# DEXTUploadX5UI(List/Tile/Single/Grid)

Component

  dextuploadx5-react 0.0.1 or later

  DEXTUploadX5UI is the base component used to create X5 UI in React. The actual package exposes DEXTUploadX5List, DEXTUploadX5Grid, DEXTUploadX5Tile, and DEXTUploadX5Single on top of it.

  This component calls DX5.create() internally using the provided props and creates or deletes the X5 instance according to the React lifecycle.

      import {
        DEXTUploadX5List,
        DEXTUploadX5Grid
      } from "dextuploadx5-react";

      function Sample() {
        return (
          <>
            <DEXTUploadX5List id="list1" style={{ width: "100%", height: "320px" }} />
            <DEXTUploadX5Grid id="grid1" style={{ width: "100%", height: "320px" }} />
          </>
        );
      }

  List, Tile, Single, and Grid components are thin wrappers that pass different fixed type values internally.

  Changing the following props recreates the internal X5 instance: id, type, progressType, path, waitingTime, lang

  The columns prop is meaningful only for Grid and rebuilds internal columns when onCreated runs.

Properties
  - columns
  - hidden
  - id
  - lang
  - progressType
  - type
  - waitingTime
  - onCreated
  - onError
  - onBeforeItemsAdd
  - onItemAdding
  - onItemsAdded
  - onBeforeItemsDelete
  - onItemDeleting
  - onItemsDeleted
  - onItemSelect
  - onItemCheck
  - onItemDoubleClick
  - onUploadBegin
  - onUploadItemStart
  - onUploadItemEnd
  - onUploadStopped
  - onUploadCompleted
  - onDownloadBegin
  - onDownloadItemStart
  - onDownloadItemEnd
  - onDownloadStopped
  - onDownloadCompleted
  - onPreview
  - onColumnDataBinding
  - onColumnDataDisplaying
  - onCompressWaitingBegin
  - onCompressWaitingCompleted
  - onCompressWaitingStopped
  - onDragAndDrop