Titel umgeschrieben als: Egal was passiert, ich kann keinen Wert aus meinem Array abrufen

Question

Ich versuche, Daten aus einem Array in meiner React-Komponente anzuzeigen.

Ich kann die Daten, die ich benötige, in der Browser-Entwicklerkonsole über console.log() sehen:

FinalRecords.js::recordTitle: (4)

0: {Mitglieder: Array(10), ID: 62, Titel: 'RR 1980 Record 1', StoreId: 1088}
1: {Mitglieder: Array(10), ID: 63, Titel: 'RR 1980 Record 2', StoreId: 1088}
2: {Mitglieder: Array(10), ID: 64, Titel: 'RR 1980 Record 3', StoreId: 1088}
3: {Mitglieder: Array(10), ID: 65, Titel: 'RR 1980 Record 4', StoreId: 1088}
Länge: 4
[[Prototyp]]: Array(0)

Aber ich kann anscheinend nicht herausfinden, wie ich an den title komme.

Ich habe viele verschiedene Dinge ausprobiert, dieses hier ist das neueste:

render() {
        const { RecordId, Records, BandName } = this.props;

        var data = Records.filter((r) => r.id === recordId);

        var Records = data.toArray();

        console.log("FinalRecords.js :: recordTitle:", Datensätze);

        return <div> record - {findRecordTitle(records, recordId) } - {bandName || ''} </div>
    }

}

Funktion findRecordTitle(records, id) {
    return Records.find((record) => {
        return record.id === id;
    })
}

Ich muss den title des Datensatzes mithilfe von id abrufen.

Aber es ist immer leer.

Habe ich etwas falsch gemacht?

Answer 1

这个函数的名称意味着你期望它返回一个"标题"（我会解释为一个字符串值）：

function findRecordTitle(records, id) {
    return records.find((record) => {
        return record.id === id;
    })
}

然而，这个函数中没有任何地方与"标题"有任何关联。它返回records数组中的一个匹配对象（或null）。如果你只想返回该对象的title属性，只需返回该属性：

function findRecordTitle(records, id) {
    return records.find((record) => {
        return record.id === id;
    })?.title; // <--- 这里
}

---

编辑：如果你的JavaScript环境无法使用可选链，你可以在尝试使用对象之前明确检查null：

function findRecordTitle(records, id) {
    const record = records.find((record) => {
        return record.id === id;
    });
    return record ? record.title : null;
}

或者可以默认为空字符串而不是null等。