Javascript 渲染时出现此错误 ；页面

我不理解这个错误 这是语法错误吗？ 这是因为react-dom版本吗

在这个块上抛出错误

getWitnessName = (witnessId) => {
    if (this.props.witnesses) {
        return this.props.witnesses.find(el => el.account_id === witnessId).account_name;
    }
}

错误是：

Uncaught TypeError: Cannot read property 'account_name' of undefined
at BlockList.__getWitnessName__REACT_HOT_LOADER__ (BlockList.js:212)
at BlockList._this.getWitnessName (BlockList.js:76)
at eval (BlockList.js:321)
at Array.map (<anonymous>)
at BlockList.render (BlockList.js:314)
at finishClassComponent (react-dom.development.js:17160)
at updateClassComponent (react-dom.development.js:17110)
at beginWork (react-dom.development.js:18620)
at HTMLUnknownElement.callCallback (react-dom.development.js:188)
at Object.invokeGuardedCallbackDev (react-dom.development.js:237)

The above error occurred in the <BlockList> component:
in BlockList (created by Connect(BlockList))
in Connect(BlockList) (created by Route)
in Route
in Switch
in div
in Router (created by ConnectedRouter)
in ConnectedRouter
in Provider
in AppContainer

未捕获类型错误：无法读取未定义的属性“account\u name”
在BlockList.\uuuuu getWitnessName\uuuuu REACT\u HOT\u LOADER\uuuuuu（BlockList.js:212）
在BlockList._this.getWitnessName（BlockList.js:76）
评估时（BlockList.js:321）
在Array.map（）处
在BlockList.render（BlockList.js:314）
在finishClassComponent（react dom.development.js:17160）
在updateClassComponent（react dom.development.js:17110）
开始工作时（react dom.development.js:18620）
在htmlunknowneelement.callCallback（react dom.development.js:188）
在Object.invokeGuardedCallbackDev（react dom.development.js:237）
组件中发生了上述错误：
在区块列表中（由Connect（区块列表）创建）
in Connect（区块列表）（由路由创建）
途中
接通开关
分头
路由器中（由ConnectedRouter创建）
在连接的外部
输入提供者
在AppContainer中

首先尝试验证以获取属性，这是因为它找不到任何验证输入。然后find返回undefined，并且不能从undefined中获取属性

比如说

this.props.witnesses.find(el => el.account_id === witnessId)?.account_name ?? 'Account Not Found'; 

---

首先尝试验证以获取属性，这是因为在验证输入中找不到任何属性。然后find返回undefined，并且不能从undefined中获取属性

比如说

this.props.witnesses.find(el => el.account_id === witnessId)?.account_name ?? 'Account Not Found'; 

你可以用

添加a以完成图片，而不是正常的

|

，正常的

不会对错误值做出反应

返回此.props.witness.find（el=>el.account\u id===witnessId）？.account\u name？？“不适用”

它将处理丢失的证人和丢失的帐户名

示例


const props={
证人：[
{帐户id:1，帐户名：“Fred”}，
{帐户id:2，帐户名：“Joe”}，
{帐户id:3}]
};
const getName=witnessId=>props.witness
.find（el=>el.account\u id===witnessId）？.account\u name？？“不适用”；
console.log（getName（1））
console.log（getName（2））
console.log（getName（3））
log（getName（4））
您可以使用

添加a以完成图片，而不是正常的
|
，正常的
不会对错误值做出反应

返回此.props.witness.find（el=>el.account\u id===witnessId）？.account\u name？？“不适用”

它将处理丢失的证人和丢失的帐户名

示例


const props={
证人：[
{帐户id:1，帐户名：“Fred”}，
{帐户id:2，帐户名：“Joe”}，
{帐户id:3}]
};
const getName=witnessId=>props.witness
.find（el=>el.account\u id===witnessId）？.account\u name？？“不适用”；
console.log（getName（1））
console.log（getName（2））
console.log（getName（3））
console.log（getName（4））
如果您看到下面的代码，那么如果未找到任何与给定见证id匹配的帐户id，则见证变量可能未定义。在这种情况下，将抛出错误，请执行此操作

getWitnessName = (witnessId) => {
    if (this.props.witnesses) {
        const witness = this.props.witnesses.find(el => el.account_id === witnessId)
        return witness ? witness.account_name : `No witness for given id: ${witnessId}`;
    }
}

如果您看到下面的代码，如果未找到任何与给定见证id匹配的帐户id，则见证变量可能未定义。在这种情况下，将抛出错误，请执行此操作

getWitnessName = (witnessId) => {
    if (this.props.witnesses) {
        const witness = this.props.witnesses.find(el => el.account_id === witnessId)
        return witness ? witness.account_name : `No witness for given id: ${witnessId}`;
    }
}

该错误意味着您的
.find（）
调用返回了
未定义的
。在某些情况下，您找不到任何帐户ID的见证人，因此
.find（）
返回
undefined
，您尝试访问
undefined
上的属性
account\u name
，顺便说一句，这不是语法错误。该错误意味着您的
.find（）
调用返回
undefined
。在某些情况下，您找的accountId没有任何见证，因此
.find（）
返回
未定义的
并且您尝试访问
未定义的
上的属性
帐户名
，顺便说一句，这不是语法错误。这实际上是一个注释，不是答案。再重复一点。或者添加一些代码示例，使其成为正确的答案this.props.witness.find（el=>el.account\u id==witnessId）？.account\u name？？'未找到帐户'；我认为概念比代码好；因为如果你理解原因和方式，你可以随心所欲地编写代码。这不是它的工作原理。后代码，最好是测试代码。对于下一位访客来说，查看示例代码更为有用，比如我的答案，顺便说一句，它与您的示例相同，但有操作符的解释，因为它们在2020年9月都非常新。这实际上是一个注释，而不是答案。再重复一点。或者添加一些代码示例，使其成为正确的答案this.props.witness.find（el=>el.account\u id==witnessId）？.account\u name？？'未找到帐户'；我认为概念比代码好；因为如果你理解原因和方式，你可以随心所欲地编写代码。这不是它的工作原理。后代码，最好是测试代码。对于下一位访客来说，查看示例代码更有用，比如我的答案，顺便说一下，它与您的示例完全相同，但是有运算符的解释，因为它们在2020年9月都是非常新的。请使用三元。。。如果没有帐户名呢？如果有更多条件，我更喜欢使用if或switch条件。如果只有一个属性，三元运算符更好。请使用三元运算符。。。如果没有帐户名呢？如果有更多条件，我更喜欢使用if或switch条件。如果只有一个属性，则三元运算符更好。如果没有帐户名，则使用可选链接
witness？.account_name | | |“no Alc name”。
maybeYes，就像在我的回答中一样如果有帐户id，则很可能也会有Alc_名称。您的任何方式都适用于所有情况，而且更好。：）我明白你的意思。谢谢您的时间。如果没有帐户名怎么办？使用可选链接
witness？.account\u name | | |“无Alc名”。
maybeYes，就像在我的回答中，如果最有可能有帐户id