React Redux Watson Chatbot Государственный выпуск - PullRequest
Новая
       9

React Redux Watson Chatbot Государственный выпуск

0 голосов
/ 22 апреля 2019

Я новичок в реакции редукса.Я пытаюсь создать чат-бота на основе Watson, используя реагирование и редукцию.Мой бэкэнд nodejs, связанный с watson api, работает нормально.Тем не менее, я немного запутался в том, как обрабатывать сообщения пользователя и бота на стороне переднего плана?

При монтировании компонента я отправляю действие в свой бэкэнд, а затем получаю ответ от Уотсона, и состояние обновляется соответствующим образом,В первый раз я отправляю только пустую строку в бэкэнд.Когда пользователь нажимает кнопку отправки сообщения со своим сообщением.Действие запускается снова.Я использую Redux Thunk, чтобы сделать асинхронную операцию.когда я получил ответ от своего бэкэнда, я отправил это действие с типом "SEND_USER_MSG_TO_SOE" & payload.Теперь мне нужно отправить предыдущий ответ, который хранится в состоянии + новый входной текст, в бэкэнд для получения нового ответа.

В моем редукторе я делаю что-то вроде этого [... state, action.payload].Теперь он также переопределяет входное значение предыдущего ответа.Не могли бы вы объяснить.

Мне нужно входное и выходное сообщение в массиве.Так что я могу использовать карту и показать ее в виде списка.

Другое дело, если я не верну [... state, action.payload] и отправлю только полезную нагрузку.Тогда я оставил только один ответ.Как я могу создать массив из него с предыдущим ответом ввода и вывода?

Я прилагаю Picture of Response.Пожалуйста, ведите меня

Изображение ответа бэкэнда Watson

Благодарственное совещание 

reducer: 
export default (state = [], action) => {
  console.log('reducer payload ---> ', action.payload);

  switch(action.type) {
    case 'SEND_USER_MSG_TO_SOE':
      return [...state, action.payload]
    default:
      return state;
  }
}

export default combineReducers({
  watsonResponse: converReducer
})


action:
export const sendMessage = (userInput) => {
  return async (dispatch, getState) => {
    let response = null;
    if (userInput === undefined) {
      response = await axios.post('http://localhost:8014/message_in', userInput);
    } else {
      let newInput = [...getState().watsonResponse];
      newInput[newInput.length - 1].input.text = userInput;
      response = await axios.post('http://localhost:8014/message_in', newInput[newInput.length - 1]);
    }
    dispatch({
      type: "SEND_USER_MSG_TO_SOE",
      payload: response.data
    });
  }
}

1 Ответ

0 голосов
/ 22 апреля 2019

Эта строка является проблемой

newInput[newInput.length - 1].input.text = userInput;

Вы перезаписываете последнюю запись в массиве пользовательским вводом. Возможно, вам нужно push новый элемент в массиве.

...