呈现页面时出现此错误

时间:2020-09-09 14:36:52

标签: javascript node.js reactjs react-dom

我不明白此错误。 这是语法错误吗? 这是由于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

4 个答案:

答案 0 :(得分:1)

您可以使用Optional chaining

添加nullish coalescing operator来完成图片,而不是普通customers = {'NAME': ['Breadpot', 'Hoviz', 'Hovis', 'Grenns', 'Magnolia', 'Dozen', 'Sun'], 'CITY': ['Sydney', 'Manchester', 'London', 'London', 'Chicago', 'San Francisco', 'San Francisco'], 'COUNTRY': ['Australia', 'UK', 'UK', 'UK', 'USA', 'USA', 'USA'], 'CPERSON': ['Sam.Keng@info.com', 'harry.ham@hoviz.com', 'hamlet.host@hoviz.com', 'grenns@grenns.com', 'man@info.com', 'dozen@dozen.com', 'sunny@sun.com'], 'EMPLCNT': [250, 150, 1500, 200, 1024, 1000, 2000], 'CONTRCNT': [48, 7, 12800, 12800, 25600, 5, 2], 'CONTRCOST': [1024.00, 900.00, 10510.50, 128.30, 512000.00, 1000.20, 10000.01] } df = pd.DataFrame(customers, columns=['CITY', 'COUNTRY', 'CPERSON', 'EMPLCNT', 'CONTRCNT', 'CONTRCOST']) new_df = df.groupby('CITY').sum().sort_values(by='CONTRCNT', ascending = False) print('City with the largest number of signed contracts:') print(new_df.index.values[0],'(', new_df.iloc[0][1], 'contracts)') ,它不会对虚假的值做出反应

||

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

示例

return this.props.witnesses.find(el => el.account_id === witnessId)?.account_name ?? "N/A";

答案 1 :(得分:1)

如果您看到以下代码,则在找不到与给定见证人ID匹配的account_id的情况下,见证人var可能是未定义的。在这种情况下,会引发错误,所以

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}`;
    }
}

答案 2 :(得分:0)

getWitnessName = (witnessId) => {
    if (this.props.witnesses) {
        let foundWitnesses = this.props.witnesses.find(el => el.account_id === witnessId);
        if(foundWitnesses)
             return foundWitnesses.account_name;
        else 
             return 'Not found';
    }
}

答案 3 :(得分:0)

尝试首先进行验证以获取属性,这是因为在该验证输入中找不到任何内容。然后find返回undefined,您将无法从undefined中获取属性。

例如

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