首页  >  问答  >  正文

标题重写为:无论如何,我都无法从我的数组中获取一个值

<p>我正在尝试在我的React组件中显示来自数组的数据。</p> <p>我可以在浏览器开发者控制台中通过<code>console.log()</code>看到我需要的数据:</p> <pre class="brush:php;toolbar:false;">FinalRecords.js :: recordTitle: (4) 0: {members: Array(10), id: 62, title: 'RR 1980 Record 1', storeId: 1088} 1: {members: Array(10), id: 63, title: 'RR 1980 Record 2', storeId: 1088} 2: {members: Array(10), id: 64, title: 'RR 1980 Record 3', storeId: 1088} 3: {members: Array(10), id: 65, title: 'RR 1980 Record 4', storeId: 1088} length: 4 [[Prototype]]: Array(0)</pre> <p>但是我似乎无法弄清楚如何获取<code>title</code>。</p> <p>我尝试了很多不同的方法,其中这个是最近的一个:</p> <pre class="brush:php;toolbar:false;">render() { const { recordId, records, bandName } = this.props; var data = records.filter((r) => r.id === recordId); var records = data.toArray(); console.log("FinalRecords.js :: recordTitle: ", records); return <div> record - {findRecordTitle(records, recordId) } - {bandName || ''} </div> } } function findRecordTitle(records, id) { return records.find((record) => { return record.id === id; }) }</pre> <p>我需要通过使用<code>id</code>来获取记录的<code>title</code>。</p> <p>但它总是空白的。</p> <p>我做错了什么吗?</p>
P粉308783585P粉308783585450 天前587

全部回复(1)我来回复

  • P粉343408929

    P粉3434089292023-08-19 09:40:13

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

    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等。

    回复
    0
  • 取消回复