0

I am trying this tutorial for the react chat and keep getting the error

TypeError: n.props.handleNewUserMessage is not a function

I tried to resolve it using the following resources:

This is my code:

import React, { Component } from 'react';
import { Widget, addResponseMessage } from 'react-chat-widget';
import 'react-chat-widget/lib/styles.css';

class App extends Component {
  componentDidMount() {
    addResponseMessage("How can I help you?");
  }

  handleNewUserMessage = (newMessage) => {
    console.log(`New message incomig! ${newMessage}`);
    // Now send the message throught the backend API
    addResponseMessage('response');
  }

  render() {
    return (
      <div className="App">
        <Widget />
      </div>
    );
  }
}


export default App;

Where have I gone wrong?

Fabian Schneider
  • 799
  • 1
  • 13
  • 40
  • handleNewUserMessage where do you use this function? You showed it's declaration, but I don't see where you use it, and the error is about this method. Looks like you should've done this – Javid Asgarov May 23 '18 at 08:42
  • Where are u calling handleNewUserMessage – Héctor May 23 '18 at 08:42

1 Answers1

3

Just as the error mentions, you forgot to actually add the method to the props:

 <Widget
    handleNewUserMessage={this.handleNewUserMessage}
 />
Daniel Krom
  • 9,751
  • 3
  • 43
  • 44