Salesforce篇——如何在lightning页面添加ListviewButton使用lwc组件

1.创建lwc组件,用于展示listview已选数据:

html:

<template>
    <lightning-card title="Selected Records">
        <p>Selected Record IDs: {selectedIds}</p>
        <lightning-button label="返回" onclick={goBack}></lightning-button>
    </lightning-card>
</template>

JS:

import { LightningElement, api, track } from 'lwc';

export default class MyFlowHandlerComponent extends LightningElement {
    @api selectedIds; // 从 Flow 传递的记录 ID

    // 当组件加载时处理记录 ID
    connectedCallback() {
        console.log('Selected Record IDs: ', this.selectedIds);
        // 可以在这里处理记录 ID,例如展示或进一步操作
    }

    goBack(){
        setTimeout(
            function(){
                window.history.back();
            },1000
        );
    }
}

meta.xml:

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>61.0</apiVersion>
    <isExposed>true</isExposed>
    <targets>
        <target>lightning__AppPage</target>
        <target>lightning__Tab</target>
        <target>lightning__FlowScreen</target>
    </targets>
    <targetConfigs>
        <targetConfig targets="lightning__FlowScreen">
            <property name="selectedIds" type="String[]"></property>
        </targetConfig>
    </targetConfigs>
</LightningComponentBundle>

2.创建screen flow

创建Collection Variables,命名必须是ids,否则拿不到selected ids

创建screen,并且选择对应的lwc组件,在lwc组件meta.xml中配置的property默认选择前面创建的variable :

保存并active

3.创建list view button:

在listview button layout中选择使用:

回到相关列表选择记录:

点击list view按钮,lwc组件拿到recordId:

  • 2
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,以下是一个简单的Salesforce LWCLightning Web Component)检索页面的实现步骤: 1. 创建一个LWC组件,可以使用Salesforce CLI或者在Salesforce中创建一个新的Lightning Web Component。 2. 在LWC组件中,创建一个HTML模板来定义检索页面的布局,例如创建一个搜索框和一个搜索按钮。 3. 创建一个JavaScript文件,来处理搜索逻辑。在搜索逻辑中,使用Lightning Data Service或者Apex Controller来搜索数据。 4. 将搜索结果展示到检索页面中。 5. 可以添加一些其他的功能,例如分页、排序等。 下面是一个简单的例子代码,可以帮助你开始实现一个LWC检索页面: HTML模板: ```html <template> <div> <lightning-input label="Search" value={searchTerm} onchange={handleSearchTermChange}></lightning-input> <lightning-button variant="brand" label="Search" onclick={handleSearch}></lightning-button> <template if:true={searchResults}> <ul> <template for:each={searchResults} for:item="result"> <li key={result.Id}>{result.Name}</li> </template> </ul> </template> </div> </template> ``` JavaScript文件: ```javascript import { LightningElement, wire } from 'lwc'; import searchContacts from '@salesforce/apex/ContactController.searchContacts'; export default class ContactSearch extends LightningElement { searchTerm = ''; searchResults; handleSearchTermChange(event) { this.searchTerm = event.target.value; } handleSearch() { searchContacts({ searchTerm: this.searchTerm }) .then(result => { this.searchResults = result; }) .catch(error => { // Handle error }); } } ``` 在这个例子中,我们使用了标准的Salesforce Contact对象,并且调用了一个Apex Controller来搜索联系人数据。你可以替换为你自己的对象和Apex Controller。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值