Je crée un composant Web Lightning pour visualiser les enregistrements des vendeurs dans un concept de chronologie. J'ai créé avec succès des composants de chronologie, des styles, etc. et récupéré des données à l'aide de l'API récemment publiée de Salesforce. J'ai inclus un lien ci-dessous pour plus d'informations. Je suis assez nouveau dans JavaScript, alors pardonnez-moi s'il y a des erreurs graves.
https://developer.salesforce.com/docs/component-library/documentation/en/lwc/lwc.reference_wire_adapters_get_lated_list_records
Le problème vient du fait que lorsque je récupère les données et que j'essaie de diviser les enregistrements en différentes collections en fonction de valeurs spécifiques des champs, cela ne produit aucun résultat. J'utilise for:each en HTML pour appeler ma collection mais aucun enregistrement ne s'affiche.
Je pense que le problème vient de la boucle for qui ajoute les données à la collection, mais je n'en suis pas sûr. J'ai ajouté data[x]
更改为 this.records[x]
et cela produit le même résultat. J'apprécie tous les conseils et accueille toute critique constructive.
Veuillez noter que lorsque j'utilise la collection d'enregistrements fournie par l'API, les enregistrements sont affichés.
Timeline.js
import { LightningElement,api, wire, track} from 'lwc'; import { getRelatedListRecords } from 'lightning/uiRelatedListApi'; export default class timeline extends LightningElement { @api recordId; @track CompletedTasks = []; @track InProgressTasks = []; @track OverdueTasks = []; error; records; @wire(getRelatedListRecords, { parentRecordId: '$recordId', relatedListId: 'Tasks__r', fields: ['Task__c.Id','Task__c.Name', 'Task__c.Estimated_Completion_Date__c', 'Task__c.Completion_Status__c'], sortBy: ['Task__c.Estimated_Completion_Date__c'], })listInfo({ error, data }) { if (data) { this.records = data.records; this.error = undefined; for (let x = 0; x < data.length; x++) { if (data[x].Completion_Status__c === "Completed") { this.CompletedTasks.append(data[x]); } else if (data[x].Completion_Status__c === "In Progress") { this.InProgressTasks.append(data[x]); } else if (data[x].Completion_Status__c === "Overdue") { this.OverdueTasks.append(data[x]); } } } else if (error) { this.error = error; this.records = undefined; } }
Timeline.html
<lightning-tab label="All Tasks" value="All Tasks" title = "All Tasks"> <div style="overflow-x: scroll; height:130px;"> <div class="tasks-container"> <template for:each={CompletedTasks} for:item="rec"> <div key={rec.fields.Id.value}> <template if:true={CompletedTasks}> <div class="task-card"> <ul class="slds-has-dividers_around-space" draggable="true"> <li class="slds-item"> <article class="slds-tile slds-tile_board"> <h3 class="slds-tile__title slds-truncate" title="Journey Name"> <p style = "font-weight: 600;">Web Development Onboarding</p> </h3> <div class="slds-tile__detail"> <div class="slds-text-heading_small"> <a> {rec.fields.Name.value} </a> </div> <p class="slds-truncate" title="Esimated Completion Date:">Esimated Completion Date:</p> <div class = "statusdate"> <p class="slds-truncate" title="Date" style = "width: 200px;">{rec.fields.Estimated_Completion_Date__c.value}</p> <div class = "statusbuttoncomplete"> <span class="slds-badge slds-theme_success">{rec.fields.Completion_Status__c.value }</span> </div> </div> </div> </article> </li> </ul> </div> </template> </div> </template> </div> </div> </lightning-tab>
Il n'y a presque aucune erreur de syntaxe dans les boucles.
data.length
因为 data 是一个对象,而不是数组。您需要data.records.length
.rec.fields.Completion_Status__c.value
)中的内容,如果您只是转到data[x].Completion_Status__c === "Completed"
Vous comparez des chaînes qui sont des objets complexes. Oui, c'est différent que lorsque vous utilisez des données envoyées depuis Apex, et c'est un peu ennuyeux, mais c'est le standard qui fonctionne pour votre API de journalisation LWC/UI...push()
,而不是append()
.Essayez cette méthode (elle sera convertie en cas de compte, tout le monde n'aura pas votre tâche personnalisée__c)