LWC 线将错误返回为 [Object Object]

Question

我正在尝试使用 Lightning 树网格 lwc 获取具有帐户层次结构的数据表。我有一个社区页面，当我打开帐户记录时，每个帐户上都有一个父 ID 字段。我正在尝试获取与当前记录具有相同父帐户的所有帐户的列表。我想显示字段名称、分支位置和分支类型。

当前没有显示数据，连线方法调用仅返回错误。数据未定义且错误，如 [object Object]

我是 LWC 新手，我做错了什么？

控制器

public with sharing class AccountHeirarchySelector {
    //Get all accounts that have the same parent Id as current record 
    @AuraEnabled(cacheable=true)
    public static List<Account> findHierarchyData(String recordId){
        String parentId= getParentId(recordId);
        List<Account> accList = new List<Account>();

        if (parentId!=null)
            accList = [select id, name, ParentId,Branch_Type__c,ShippingAddress from Account where ParentId=:parentId];    
    
         System.debug('-------accList------------'+accList);
        return accList;
    }

    //Get the Parent Id value for current Record
    public static String getParentId(String recordId ){
        List<Account> parentIdFromAcc= [select ParentId from Account where id=:recordId LIMIT 1];

        System.debug('-------parentIdFromAcc------------'+parentIdFromAcc);
        System.debug('-------parentIdFromAcc[0].ParentId------------'+parentIdFromAcc[0].ParentId);

        return parentIdFromAcc[0].ParentId;
    }
}

JS

import { LightningElement,wire,api,track } from 'lwc';
import findHierarchyData from '@salesforce/apex/AccountHeirarchySelector.findHierarchyData';
const COLS= [
    {label : 'Account Name 1', fieldName : 'Name'},
    {label : 'Branch Location 1', fieldName : 'ShippingAddress'},
    {label : 'Branch Type 1', fieldName : 'Branch_Type__c'}
]

export default class branchAccountTreeGridView extends LightningElement {
    @track accountsLoaded = false;
    @api recordId;
    @track gridData = [];
    gridColumns = COLS;

    @wire(findHierarchyData, { recordId: '$recordId'}) 
    wiredAccounts({ data, error }) {
        console.log('after method call')
        console.log('----------fetched rec id ? -------:'+this.recordId);
        console.log('----------data ? --------------------' +  data);
        console.log('----------error ? --------------------' + error);
       
        if (data) {
            this.accountsLoaded = true;
            // Process record data
            console.log('-------found data -------------'+this.recordId);
            console.log('dataaaaaaaaaaaaa' + data);
            var strData = JSON.parse( JSON.stringify( data ) );
            
            strData.map((row, index) => {
                if (row['Name']) {
                    row._children = row['Name']; //define rows with children 
                    delete row.Cases;
                    
                }     
            });
            this.myData = strData;
        }
        
        else if(error){
            console.log('Stringified error ---- ' + JSON.parse(JSON.stringify(error)));
        }
    }
}

meta.xml

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata" fqn="accountHeirarchy">
    <apiVersion>55.0</apiVersion>
    <isExposed>true</isExposed>
    <targets>
        <target>lightning__RecordPage</target>
        <target>lightning__AppPage</target>
        <target>lightning__HomePage</target>
         <target>lightningCommunity__Page</target>
        <target>lightningCommunity__Default</target>
        <target>lightning__RecordAction</target>
    </targets>
    <targetConfigs>
        <targetConfig targets="lightning__RecordPage">
            <objects>
                <object>Account</object>
            </objects>
        </targetConfig>
        <targetConfig targets="lightningCommunity__Default">
            <property
                name="recordId"
                type="String"
                label="Record Id"
                description="Pass the page's record id to the component variable" 
                />
        </targetConfig>
    </targetConfigs>
</LightningComponentBundle>`

HTML 模板

<template>
    <template if:true={accountsLoaded}>
        <lightning-tree-grid 
            columns={gridColumns}
            data={gridData}
            key-field="Id">
        </lightning-tree-grid>
    </template>
</template>

控制台中的结果

branchAccountTreeGridView.js:1 ----------fetched rec id ? -------:0010w000010FnfWAAS
branchAccountTreeGridView.js:1 ----------data ? --------------------undefined
branchAccountTreeGridView.js:1 ----------error ? --------------------[object Object]
branchAccountTreeGridView.js:1 Stringified error ---- [object Object]

Answer 1

因此，要在控制台中查看错误，只需删除

JSON.parse

，这会将字符串版本转换回一个对象，在将其打印为字符串之前，该对象显然是错误的。替代解决方案是保留它，但使用

,

而不是

+

。最后也是最好的，查看 devtool 中的网络选项卡，直接从网络调用中获取信息。这将防止您编写要删除的代码。

关于真正的问题，即wire方法返回错误。可能，

getParentId

中的查询返回 0 条记录，这就是为什么

parentIdFromAcc[0].ParentId

然后抛出空指针异常。 这取决于您的设置以及该帐户 ID 的来源。分享更多细节会有所帮助。但也许当您收到错误消息时，您会自己找出要修复的内容。

Answer 2

要查看结果而不是 [object, object] 使用 JSON.stringify();