Posts

実装例 export class EventEmitter { constructor() { this.registry = {}; } on(name, listener) { this.registry[name] = this.registry[name] || []; this.registry[name].push(listener); return this; } once(name, listener) { const doOnce = function () { listener.apply(null, arguments); this.removeListener(name, doOnce); }.bind(this); this.on(name, doOnce); return this; } emit(name) { const args = Array.prototype.slice.call(arguments, 1); const listeners = this.registry[name]; let count = 0; if (listeners) { listeners.forEach((listener) => { count += 1; listener.apply(null, args);...

1.説明 セッションストレージとロカールストレージ Util の作成方法を共有します。 2.ソース /** * セッション */ export const session = { /** * セッションストレージ設定 *...

1.目的 レスポンスクラスハンドラーの作成方法を共有します。 2.ソース /** * リクエストの結果をハンドリングする. * @param {Promiss} promiss * @return reponse レスポンス => {success: XXX, data:...

LWC での Toast メッセージ LWC で Toast メッセージを表示するために、共通の Util クラスを作成することができます。 Toast メッセージのタイトル、メッセージ、種類(suc...

共通モーダル画面作成方法説明 共通モーダルはモーダルを開くための API を持ち、他のコンポーネントから呼び出すことができます。 他のコンポーネントで、...

目的 JavaScript でブラウザを判断する方法を共有します。 実行方法 export const isIE11 = isIE11Test(navigator); export const isChrome = isChromeTest(navigator); export const isSafari = isSafariTest(navigator); export function isIE11Test(navigator) { return /Trident.*rv[ :]*11\./.test(navigator.userAgent); } export function isChromeTest(navigator) { return ( /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor) ); } export function isSafariTest(navigator) { return /^((?!chrome|android).)*safari/i.test(navigator.userAgent); }

Apex共通レスポンス基底クラス作成方法 LWC で Apex クラスを呼出す基底クラスを作成する方法を共有します。 LWC で Apex クラスを呼出すときの返却値は主に正常...

実装例 /** * 配列の比較 * @param array1 配列1 * @param array2 配列2 * @returns 同じの場合：True、その他の場合：False */ export const arraysEqual = (array1, array2) => { if (!array1 || !array2) { return false; } if (array1.length !== array2.length) { return...

実行例 /** * オブジェクトをコピー * @param obj 対象オブジェクト * @return 新しいオブジェクト */ export const deepCopy = (obj) => { if (Object(obj) !== obj) { return obj; } if (obj instanceof Set) { return new Set(obj); } if (obj instanceof Date) { return new Date(obj);...

UUID 説明 UUID（Universally Unique Identifier）は、一意の識別子を生成するための規格です。UUID は 128 ビットの値で表され、通常...

署名付き URL の説明 署名付き URL は、AWS S3（Simple Storage Service）のリソースに対して一時的なアクセス許可を付与するための URL です。通常、...

作成方法 Apex REST API コールアウトユーティリティ（Apex REST API Callouts Utility）を作成するには、以下の手順を参考にしてください。 Apex クラスの作成: 新し...

目的 LWC でのファイルダウンロード方法を共有します。 ソース構成図 force-app └─main └─default ├─classes │ ├─GetFileDemoC...

ClassモードでVFページにLWCを使う方法 Lightning Outの使用 提供されたコードはLightning Outを使用していますが、Classicモー...

VF ページに LWC を表示する方法説明 基本的な考え方は VF ページに LightningOut という仕組みを利用して、LWC を表示すると思います。 LightningOut の仕組み VF ⇒ Aura ⇒ LWCという...

1.目的 今回 LWC 中に AWS の SDK for javascript で S3 と連携する方法を共有します。 2.前提 2.1.AWS S3 バケット Cross-Origin Resource Sharing (CORS)の設定 [ { "AllowedHeaders": ["*"], "AllowedMethods": ["HEAD", "GET", "PUT", "POST", "DELETE"], "AllowedOrigins": ["*"], "ExposeHeaders": ["ETag"] } ] 2.2.Salesforce 側...

1.目的 LWC での DatePicker の作成方法を共有します。 2.ソース構成図 lwc ├─datePicker └─datePickerContainer datePicker .select-box { background-color: rgb(255, 255, 255); border:...

1.目的 今回 LWC での共通 Util の作成方法を共有します。 2.ソース構成図 lwc ├─commonUtil └─commonUtilChild commonUtil /** * デートフォ...

LWC 共通 CSS 方法説明 スタイルシートを使用して共通の CSS を定義し、それを複数のコンポーネントでインポートします。 CSS をグローバルに定義し、それをすべて...

1.目的 今回Lighting Desigin Systemで提供された標準デザインを変えようと思います。 基本的にはスタイルフックを使って、標準のデザインを変...