Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

149
Visualizações
Integrate chatbot Dialogflow in react native?

I am new in react native and currently, I want to integrate chatbot Dialogflow in react-native but I do not get success with this then please give me some solutions to this step by step

about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

Here you will have a tutorial! And below will be work for both react native expo and without expo.

https://blog.jscrambler.com/build-a-chatbot-with-dialogflow-and-react-native/

here bellow some code:

import React, { Component } from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { GiftedChat } from 'react-native-gifted-chat';
import { Dialogflow_V2 } from 'react-native-dialogflow';

import { dialogflowConfig } from './env';

const BOT_USER = {
  _id: 2,
  name: 'FAQ Bot',
 avatar: 'https://i.imgur.com/7k12EPD.png'
};

class App extends Component {
 state = {
   messages: [
    {
    _id: 1,
    text: `Hi! I am the FAQ bot 🤖 from Jscrambler.\n\nHow may I help you with today? 
    `,
     createdAt: new Date(),
    user: BOT_USER
   }
  ] 
};

componentDidMount() {
 Dialogflow_V2.setConfiguration(
  dialogflowConfig.client_email,
  dialogflowConfig.private_key,
  Dialogflow_V2.LANG_ENGLISH_US,
  dialogflowConfig.project_id
 );
}

handleGoogleResponse(result) {
 let text = result.queryResult.fulfillmentMessages[0].text.text[0];
 this.sendBotResponse(text);
}

onSend(messages = []) {
  this.setState(previousState => ({
  messages: GiftedChat.append(previousState.messages, messages)
}));

let message = messages[0].text;
Dialogflow_V2.requestQuery(
  message,
  result => this.handleGoogleResponse(result),
  error => console.log(error)
 );
}

sendBotResponse(text) {
  let msg = {
  _id: this.state.messages.length + 1,
  text,
  createdAt: new Date(),
  user: BOT_USER
};

 this.setState(previousState => ({
   messages: GiftedChat.append(previousState.messages, [msg])
  }));
 } 

render() {
 return (
  <View style={{ flex: 1, backgroundColor: '#fff' }}>
    <GiftedChat
      messages={this.state.messages}
      onSend={messages => this.onSend(messages)}
      user={{
        _id: 1
      }}
    />
  </View>
    );
  }
 }

 export default App;
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda