Question

我有两个闪电Web组件，并且必须在单击按钮时从一个LWC导航到另一个LWC。

我尝试使用导航服务在组件的基类中应用NavigationMixin函数来扩展NavigationMixin（LightningElement）。但这没用。

请任何人可以帮助我吗？

谢谢。

Answer 1

您还不能。

List of all interesting PageReference types说您应该使用standard__component，但是目标不能是纯LWC。充其量只能隐藏在Aura包装纸内。

闪电组件。要制作可寻址的Lightning Web组件，将其嵌入到实现 lightning:isUrlAddressable界面。

这很痛苦。我怀疑这也是为什么我们不能对LWC采取快速行动的原因，它们必须包裹在Aura中。

单击引号中的链接，它将带您示例如何传递参数（/lightning/cmp/c__helloTarget?c__firstname=John）

Answer 2

我遇到过类似的问题。我一直在尝试从社区中的另一个导航到LWC，它看起来像：在社区中，仅comm__namedPage页面引用有效。

Answer 3

在Salesforce LWC应用程序中，您可以使用以下代码从一个LWC组件导航到另一个（在另一个选项卡/应用程序页面上）组件

myComponent.html

<a href="javascript:void(0);" tabindex="0" onclick={navigateNext}>Click Here</a>

myComponent.js

    import { NavigationMixin } from 'lightning/navigation';
    import { CurrentPageReference } from 'lightning/navigation';

    export default class MyComponent extends NavigationMixin(LightningElement){

        @wire(CurrentPageReference) pageRef;

        @api tabName = "NextPage";
        navigateNext() {
            console.log("tabName = ", this.tabName)
            this[NavigationMixin.Navigate]
                ({
                    type: 'standard__navItemPage',
                    attributes: {
                        apiName: this.tabName
                    }
                });
        }
    }

请用您应该浏览的应用页面/标签名称替换tabName变量。

就是这样。单击html中的tabName时，您将导航到指定的button

您还可以查看官方文档以了解更多信息：https://developer.salesforce.com/docs/component-library/documentation/en/lwc/lwc.use_navigate_basic

从一个LWC导航到另一个LWC

3 个答案: