ビジュアルフォースページ内のlwcからのナビゲーション

Aug 24 2020

Visualforceページで標準のsalesforceボタンを上書きしました。を使用して、その中のlwcコンポーネントを使用していltng:outます。次に、lightningコンポーネントから他のページに移動したいのですが、移動できません。オーラでは、私sforce.one.navigatetourlは同じような状況で使用していました。ブラウザの戻るボタンLightningfor Vfページで正しく機能しませんか?

を使用するwindow.locationと、このウィンドウがウィンドウUI内に表示されます。

ここからSalesforceLightningUIに安全に戻る方法。ltng:out内では機能しない稲妻ナビゲーションを使用しました。

コードは非常に単純です。

<aura:application extends="ltng:outApp" access="GLOBAL">
    <aura:dependency resource="c:accountDelete" />
</aura:application> 

cmp.html

<template>
    <lightning-button label="goThere" onclick={handleNavigation}></lightning-button>
</template>

cmp.js

import { LightningElement, api, wire  } from 'lwc';
    handleNavigation(){
        window.location = '/001';
    }

Visualforceページ:

<apex:page standardController="Account"  sidebar="false">
<apex:includeLightning />    
<div id="LightningComponentid" />    
    <script>
        $Lightning.use("c:AccountDeleteApp", function() { $Lightning.createComponent("c:accountDelete",
            { 
            "id" : "{!$CurrentPage.parameters.id}"
            },
            "LightningComponentid",
            function(cmp) {});
        });
    </script>
</apex:page>

回答

1 ManjotSingh Aug 25 2020 at 15:36

lwcの属性として関数を渡すソリューションを見つけました。

<apex:page standardController="Account"  sidebar="false">
    <apex:includeLightning />    
    <div id="LightningComponentid" />    
    <script>
    $Lightning.use("c:AccountDeleteApp", function() { $Lightning.createComponent("c:accountDelete",
          { 
            "id" : "{!$CurrentPage.parameters.id}",
            "navigateToList" : navigateToList
          },
          "LightningComponentid",
          function(cmp) {});
    });
    function navigateToList(url) {
      if(typeof sforce != 'undefined' && sforce && sforce.one){
         sforce.one.navigateToURL(url);
      } else {
         window.location.href = url;
      }
    }
    </script>
</apex:page>

次に、LWCに変更を加えます

import { LightningElement, api  } from 'lwc';
export default class AccountSetDelete extends LightningElement {
    @api id;
    @api navigateToList;
    handleNavigation(){
       this.navigateToList('/001');
    }
}

したがって、解決策は、vfページからlwcに関数参照を渡し、lwcからそのメソッドを呼び出して使用することです。

sforce.one.navigateToURL

vfページで。