見出し画像

Lightning Web Componentsでサンプルデータを扱う方法

SalesforceのLightningでオリジナルのコンポーネントを作る時に、まず、画面部分だけをプロトタイプして、お客様のOKをいただいてデータ連携部分を作り込むようにすると無駄がありません。

プロトタイプの時に、データはどうするのか。

データだけのLightning Web Componentsを作ります。

例えば、以下のようにJSONでデータを定義します。ファイル名は、data.jsとしておきます。

export const orderList = [
   {
       Id: 'aaaa',
       Name: '2019/01/11 12:11',
       Amount__c: '1000000',
       isClosing__c: true
   },
   {
       Id: 'aaaa',
       Name: '2019/02/11 12:11',
       Amount__c: '1000000',
       isClosing__c: true
   },
   {
       Id: 'aaaa',
       Name: '2019/03/11 12:11',
       Amount__c: '1000000',
       isClosing__c: true
   },
   {
       Id: 'aaaa',
       Name: '2019/04/11 12:11',
       Amount__c: '1000000',
       isClosing__c: true
   },
   {
       Id: 'aaaa',
       Name: '2019/05/11 12:11',
       Amount__c: '1000000',
       isClosing__c: true
   },
   {
       Id: 'aaaa',
       Name: '2019/06/11 12:11',
       Amount__c: '1000000',
       isClosing__c: true
   },
   {
       Id: 'aaaa',
       Name: '2019/07/11 12:11',
       Amount__c: '1000000',
       isClosing__c: true
   },
   {
       Id: 'aaaa',
       Name: '2019/08/11 12:11',
       Amount__c: '1000000',
       isClosing__c: false
   }
];

プロトタイプ側のLightning Web Componentsで、以下のようにインポートします。

import { orderList } from 'c/data';

「c/」と付けるところがポイントです。

この記事が気に入ったら、サポートをしてみませんか?気軽にクリエイターを支援できます。

生涯現役なデベロッパーを目指しています。Typescript、Javascript、Salesforceのフルスタックデベロッパーとして日々コードを綴っています。コードを綴る中で、「これは!?」と思ったものを記事にしています。
コメントを投稿するには、 ログイン または 会員登録 をする必要があります。