0

and try to use LWC in a flow. I want to upload a csv file in the flow first. And I then put a Lightning Web App into the next screen. Then inside the LWC, I want to pass the file Id of the uploaded file to an apex class and use to display the apex output. However, even though I annotate the fileId correctly using '@api' in the .js file and added in the .xml file, my apex class seem to fail to get the input and returns nothing. (ps. I selected the input for the LWC in the flow).

Here are the simplified version of my code:

//Apex
public with sharing class getContact {

    @AuraEnabled
    public static List<Contact> getContact(String hardId) {
        return [SELECT Name FROM Contact WHERE Id =: hardId];
    }
}

<template>
    <div>
        <lightning-datatable
            key-field="id"
            data = {data}
            columns = {columns}
        ></lightning-datatable>
    </div>
</template>

//lwc.js
import { LightningElement, track, api, wire } from 'lwc';
import {ShowToastEvent} from 'lightning/platformShowToastEvent';
import getContactttt from '@salesforce/apex/getContact.getContact';

const COLUMNS = [
    {label: 'Contact Name', fieldNmae: 'Name'}
]

export default class lwc extends LightningElement {
    columns = COLUMNS;
    @api hardRecordId;

    @wire(getContactttt, {hardId: "$hardRecordId"})
    data;
}

///lwc.js-meta.xml
<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>52.0</apiVersion>
    <isExposed>true</isExposed>
    <targets>
        <target>lightning__FlowScreen</target>
        <target>lightning__AppPage</target>
        <target>lightning__Tab</target>
        <target>lightning__RecordPage</target>
        <target>lightning__HomePage</target>
    </targets>
    <targetConfigs>
        <targetConfig targets="lightning__FlowScreen">
            <property name="hardRecordId" type="String" label="Current File Id" 
                        description="Id of the current Uploaded CSV file"/>
        </targetConfig>
    </targetConfigs>
</LightningComponentBundle>

How I put the input to the lwc in flow:

enter image description here


The result datatable is empty:

enter image description here

0
1

The wire adapters return a JS object with a key called data that contains your actual data.

This is a bit confusing because you've called your variable data.

Try replacing your html with:

<template>
    <div>
        <template if:true={data.data}>
            <lightning-datatable
                key-field="id"
                data = {data.data}
                columns = {columns}
            ></lightning-datatable>
        </template>
    </div>
</template>

It would be worthwhile renaming your variable to something different to remove this confusion

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.