TypeError：无法读取未定义 React.js 的属性“字段”答案

【问题标题】：TypeError: Cannot read property 'fields' of undefined React.jsTypeError：无法读取未定义 React.js 的属性“字段”
【发布时间】：2019-08-25 09:23:52
【问题描述】：

我正在构建一个聊天机器人，但在与 Bot 的对话中遇到了一些问题。在对话的某个时刻，我看到了错误：TypeError: Cannot read property 'fields' of undefined

I building a chatbot and I have some problem with the conversation with the Bot. At some point of the conversation I saw error: TypeError: Cannot read property 'fields' of undefined



componentDidUpdate() {
        this.scrollToBottom();
        if ( this.talkInput ) {
            this.talkInput.focus();
        }
    }
    _handleInputKeyPress(e) {
        if (e.key === 'Enter') {
            this.df_text_query(e.target.value);
            e.target.value = '';
        }
    }

    _handleQuickReplyPayload(payload, text) {
        switch (payload) {
            case 'recommend_yes':
                this.df_event_query('SHOW_RECOMMENDATIONS');
                break;
            case 'training_maybe':
                this.df_event_query(text);
                break;
            default:
                this.df_text_query(text);
        }
    }

    renderCards(cards) {
        return cards.map((card, i) => <Card key={i} payload={card.structValue}/>);
    }
    renderOneMessage(message, i) {
        if (message.msg && message.msg.text && message.msg.text.text) {
            return <Message key={i} speaks={message.speaks} text={message.msg.text.text}/>; 
        } else if (message.msg && message.msg.payload.fields.cards) { //message.msg.payload.fields.cards.listValue.values
            return <div key={i}>
                <div className="card-panel grey lighten-5 z-depth-1">
                    <div style={{overflow: 'hidden'}}>
                        <div className="col s2">
                            <a href="/" className="btn-floating btn-large waves-effect waves-light red">{message.speaks}</a>
                        </div>
                        <div style={{ overflow: 'auto', overflowY: 'scroll'}}>
                            <div style={{ height: 300, width:message.msg.payload.fields.cards.listValue.values.length * 270}}>
                                {this.renderCards(message.msg.payload.fields.cards.listValue.values)}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        } else if (message.msg &&
            message.msg.payload &&
            message.msg.payload.fields &&
            message.msg.payload.fields.quick_replies
        ) {
            return <QuickReplies
                text={message.msg.payload.fields.text ? message.msg.payload.fields.text : null}
                key={i}
                replyClick={this._handleQuickReplyPayload}
                speaks={message.speaks}
                payload={message.msg.payload.fields.quick_replies.listValue.values}/>;
        }
    }
    renderMessages(returnedMessages) {
        if (returnedMessages) {
            return returnedMessages.map((message, i) => {
                    return this.renderOneMessage(message, i);
                }
            )
        } else {
            return null;
        }
    }

当我点击“是”按钮时，机器人需要给我一些答案。但相反，我在我的页面上看到了这个错误：https://prnt.sc/ox4i1r

【问题讨论】：

标签： javascript node.js reactjs dialogflow-es chatbot

【解决方案1】：

您需要在此处添加对有效负载的额外检查：

} else if (message.msg && message.msg.payload.fields.cards) {

像这样：

} else if (message.msg && message.msg.payload &&  message.msg.payload.fields.cards) {

【讨论】：

您能否给我确切的代码，您认为我需要添加什么，因为我不明白在哪里添加此有效负载？ :)
现在，没有这个错误，但是如果我在开发工具上单击按钮并继续网络，我会看到：prnt.sc/ox4py8 由于某种原因我无法获取 df_event_query：@987654322 @

【解决方案2】：

'use strict';

const chatbot = require('../chatbot/chatbot');

module.exports = app => {

    app.get('/', (req, res) => {
    res.send({'zdravo': 'ljudi'})
    });

    app.post('/api/df_text_query', async (req, res) => {

        let responses = await chatbot.textQuery(req.body.text, req.body.userID, req.body.parameters);        
        res.send(responses[0].queryResult);
        res.end();
    });

    app.post('/api/df_event_query', async (req, res) => {
        let responses = await chatbot.eventQuery(req.body.event, req.body.userID, req.body.parameters);        
        res.send(responses[0].queryResult);
        res.end();
    });

}

这是带有 df_event_query 的 nodejs 代码

【讨论】：