LWC：Wire Return 代码有什么问题？

Question

问题出在结果函数内 JS 代码中的这一行 - return this.wirestoredrecords.data.LastName;

我正在尝试使用 Getter 获取联系人字段值并显示在 HTML 中。请帮助。

**JS CODE:**

import { api, LightningElement, wire } from 'lwc';
import { getRecord } from 'lightning/uiRecordApi';
import Name from '@salesforce/schema/Contact.Name';
import LastName from '@salesforce/schema/Contact.LastName';
import Phone from '@salesforce/schema/Contact.Phone';

const contactfields = [Name, LastName, Phone];

export default class WireGetRecords extends LightningElement {
    @api recordId;
    datavalue;

    @wire(getRecord, { recordId: '$recordId', fields: contactfields })
    wirestoredrecords;

    get result(){

        return this.wirestoredrecords.data.LastName;

    }

}

**HTML CODE:**
<template>
    <lightning-card>
        <div>{recordId}</div>
        <div>{result}</div>
        <div></div>
    </lightning-card>
</template>```

Answer 1

您的组件加载到页面并调用 @wire。
该组件不会等待 @wire 完成，它会在完成时完成，异步。您的组件继续。
遇到html渲染，调用你的getter。好吧，那个时候变量是 undefined/null，@wire 还没有 return。该代码尝试执行 null.data 并抛出，因为 null/undefined 没有字段。
砰，爆头。

在 getter 中进行一些空检查或使用 ?. operator

LWC：Wire Return 代码有什么问题？

LWC: What's wrong with the Wire Return code?

html

javascript

salesforce

salesforce-lightning

lwc