salesforce 如何访问lwc组件

2024-04-30 16:20
文章标签 访问 组件 salesforce lwc

本文主要是介绍salesforce 如何访问lwc组件,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

访问lwc有哪些途径呢?

    • Action Button
    • Tab
    • Aura use lwc
    • (拓展)如何区分是新建页面还是编辑页面

Action Button

xml文件中要配置tab<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata" ><apiVersion>56.0</apiVersion><isExposed>true</isExposed><targets><target>lightning__RecordPage</target><target>lightning__AppPage</target><target>lightning__HomePage</target><target>lightning__Tab</target><target>lightning__RecordAction</target></targets>
</LightningComponentBundle>

在这里插入图片描述

Tab

在这里插入图片描述

xml文件中要配置tab

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata" ><apiVersion>56.0</apiVersion><isExposed>true</isExposed><targets><target>lightning__RecordPage</target><target>lightning__AppPage</target><target>lightning__HomePage</target><target>lightning__Tab</target></targets>
</LightningComponentBundle>

Aura use lwc

在正常的lwc文件上,创建一个aura组件
lwc js文件中 @api recordId;

Aura cmp文件:<aura:component implements="flexipage:availableForAllPageTypes,force:hasRecordId,lightning:actionOverride,force:appHostable,lightning:isUrlAddressable,force:lightningQuickActionWithoutHeader,forceCommunity:availableForAllPageTypes,lightning:hasPageReference"><aura:handler name="change" value="{!v.pageReference}" action="{!c.reInit}"/><c:salesOrderConfirmLwc recordId="{!v.recordId}"></c:salesOrderConfirmLwc>
</aura:component>js文件:({init : function(component, event, helper) {//从url取门店的Id字符串,从VF传入var pageRef = component.get("v.pageReference");if(pageRef != undefined && pageRef != "" && pageRef != null){var orderIdStr = component.get("v.pageReference.state.c__recordId");console.log("orderIdStr"+JSON.stringify(orderIdStr));component.set("v.recordId" , orderIdStr);}},reInit : function(component, event, helper) {$A.get('e.force:refreshView').fire();  },
})可通过url带参进aura访问lwc:
/lightning/cmp/c__SalesOrderConfirmCmp?c__recordId={!Order__c.Id} 或者aura直接覆盖标准按钮访问lwc(一个aura可以同时覆盖新建跟编辑)
这个直接拿到recordId

(拓展)如何区分是新建页面还是编辑页面

import { CurrentPageReference, NavigationMixin } from 'lightning/navigation';
import { LightningElement, wire, track, api} from 'lwc';export default class salesOrderCreateLwc extends NavigationMixin(LightningElement) {@api recordId;@wire(CurrentPageReference) pageRef;connectedCallback() {console.log("pageRef->"+ JSON.stringify(this.pageRef));let actionName = this.pageRef.attributes.actionName;this.recordId = this.pageRef.attributes.recordId;console.log("actionName->"+actionName);console.log("recordId->"+this.recordId);if (actionName == 'edit') {}}
}

这篇关于salesforce 如何访问lwc组件的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!


原文地址:
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.chinasem.cn/article/949337

相关文章

C++ RabbitMq消息队列组件详解

《C++RabbitMq消息队列组件详解》:本文主要介绍C++RabbitMq消息队列组件的相关知识,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录1. RabbitMq介绍2. 安装RabbitMQ3. 安装 RabbitMQ 的 C++客户端库4. A

NGINX 配置内网访问的实现步骤

《NGINX配置内网访问的实现步骤》本文主要介绍了NGINX配置内网访问的实现步骤,Nginx的geo模块限制域名访问权限,仅允许内网/办公室IP访问,具有一定的参考价值,感兴趣的可以了解一下... 目录需求1. geo 模块配置2. 访问控制判断3. 错误页面配置4. 一个完整的配置参考文档需求我们有一

C#实现访问远程硬盘的图文教程

《C#实现访问远程硬盘的图文教程》在现实场景中,我们经常用到远程桌面功能,而在某些场景下,我们需要使用类似的远程硬盘功能,这样能非常方便地操作对方电脑磁盘的目录、以及传送文件,这次我们将给出一个完整的... 目录引言一. 远程硬盘功能展示二. 远程硬盘代码实现1. 底层业务通信实现2. UI 实现三. De

PyQt6中QMainWindow组件的使用详解

《PyQt6中QMainWindow组件的使用详解》QMainWindow是PyQt6中用于构建桌面应用程序的基础组件,本文主要介绍了PyQt6中QMainWindow组件的使用,具有一定的参考价值,... 目录1. QMainWindow 组php件概述2. 使用 QMainWindow3. QMainW

python通过curl实现访问deepseek的API

《python通过curl实现访问deepseek的API》这篇文章主要为大家详细介绍了python如何通过curl实现访问deepseek的API,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编... API申请和充值下面是deepeek的API网站https://platform.deepsee

Nginx 访问 /root/下 403 Forbidden问题解决

《Nginx访问/root/下403Forbidden问题解决》在使用Nginx作为Web服务器时,可能会遇到403Forbidden错误,文中通过示例代码介绍的非常详细,对大家的学习或者工作... 目录解决 Nginx 访问 /root/test/1.html 403 Forbidden 问题问题复现Ng

Vue3组件中getCurrentInstance()获取App实例,但是返回null的解决方案

《Vue3组件中getCurrentInstance()获取App实例,但是返回null的解决方案》:本文主要介绍Vue3组件中getCurrentInstance()获取App实例,但是返回nu... 目录vue3组件中getCurrentInstajavascriptnce()获取App实例,但是返回n

SpringQuartz定时任务核心组件JobDetail与Trigger配置

《SpringQuartz定时任务核心组件JobDetail与Trigger配置》Spring框架与Quartz调度器的集成提供了强大而灵活的定时任务解决方案,本文主要介绍了SpringQuartz定... 目录引言一、Spring Quartz基础架构1.1 核心组件概述1.2 Spring集成优势二、J

Vue中组件之间传值的六种方式(完整版)

《Vue中组件之间传值的六种方式(完整版)》组件是vue.js最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用,针对不同的使用场景,如何选择行之有效的通信方式... 目录前言方法一、props/$emit1.父组件向子组件传值2.子组件向父组件传值(通过事件形式)方

Spring组件初始化扩展点BeanPostProcessor的作用详解

《Spring组件初始化扩展点BeanPostProcessor的作用详解》本文通过实战案例和常见应用场景详细介绍了BeanPostProcessor的使用,并强调了其在Spring扩展中的重要性,感... 目录一、概述二、BeanPostProcessor的作用三、核心方法解析1、postProcessB