www.dextsolution.com
DEXTUPLOAD
X5
menu toggleReact リファレンス > DEXTUploadX5Provider

DEXTUploadX5Provider

コンポーネント

dextuploadx5-react 0.0.1 以降

DEXTUploadX5Provider は、React 環境で DEXTUploadX5 製品スクリプトを読み込み、子 React X5 コンポーネントが使用するグローバル設定を準備する最上位ラッパーコンポーネントです。

このコンポーネントは、渡された authKeyproductPath をもとにブラウザのグローバルオブジェクトへ dextuploadx5Configuration を設定し、その後 dextuploadx5.js を動的に読み込みます。

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

export default function App() {
  return (
    <DEXTUploadX5Provider
      authKey="..."
      productPath="/dx5/"
    >
      <DEXTUploadX5List id="dext5" style={{ width: "100%", height: "320px" }} />
    </DEXTUploadX5Provider>
  );
}

DEXTUploadX5Provider の準備が完了する前に、子 DEXTUploadX5 React コンポーネントをレンダリングしてはいけません。

実際の X5 製品ファイルはブラウザからアクセスできる場所に配置されている必要があり、dextuploadx5.js は productPath 基準で読み込まれます。

属性