【Salesforce】ExperienceCloudサイト画面遷移Utilを自分で作る

LWC での画面遷移

LWC の中にNavigationMixinを提供しています、それを利用して、画面を遷移することができます、今回はNavigationMixinを利用して、ExperienceCloud サイト専用の画面遷移 Util を作成します。

this[NavigationMixin.Navigate]({
    type: 'comm__namedPage'
    attributes: {
        pageName: '画面名'
    }
})

実装例

以下は、画面遷移 Util の実装例

import { NavigationMixin } from "lightning/navigation";

/**
 * 画面遷移(パラメータ無し)
 * @apram {*} that this
 * @param {*} pageName ページ名
 */
export const navigationPage = (that, pageName) => {
    that[NavigationMixin.Navigate]({
        type: 'comm__namedPage'
        attributes: {
            pageName: pageName
        }
    })
};


/**
 * 画面遷移(パラメータ有り)
 * @apram {*} that this
 * @param {*} pageName ページ名
 * @param {*} param パラメータ
 */
export const navigationPage = (that, pageName, param) => {
    that[NavigationMixin.Navigate]({
        type: 'comm__namedPage'
        attributes: {
            pageName: pageName
        },
        state: param
    })
};