Реакция на вызов вызвана на основе условия за пределами рендера - PullRequest
Новая
       19

Реакция на вызов вызвана на основе условия за пределами рендера

0 голосов
/ 10 октября 2019

Я пытаюсь заставить систему уведомлений реагировать, где я использую систему react-toastify

Пока у меня есть сокетное соединение (с socket.io), подключенное к моему серверу, который отправляетответ клиенту при получении уведомления. 

const {endpoint} = this.state
            const socket = socketIOClient(endpoint);
            console.log("created")
            socket.on('updatelogs', data =>
            this.setState({logs: data}, 
            () => createNotification(data.pop().log.level, data.pop().log.message))) // here i use a callback to create the notification
          }

У меня есть система ведения журналов, где я беру последние log добавленные в стек и передаю их на основе атрибутов внутри этого.

Внутри моей функции createNotficiationУ меня есть какая-то фиктивная логика, подобная этой. 

export const createNotification = (level, message) =>{ 
    switch (level) {
            case 'info':
              return toast('info')
            case 'success':
              return toast("success");
            case 'warning':
              return toast("warning");
            case 'error':
              return toast("error");
          }
        }

Здесь я хочу вызвать toast, основываясь на том, что передано, но ничего не рендерится. Я пробовал с простой alert, которая отлично работает.

Вот моя конфигурация для тостов

Внутри App.js: 

  render() {
    toast.configure();
    return (
      <div className="App">
          <NewComponent
          name={this.state.name} handleChange={this.setNameHandler}
          preproccessHandler={this.setPreprocessHandler} isPreproccess={this.state.isProcessedData} 
          hasProcessedDBScan={this.state.isProcessedDBScan} setProcessedHandler={this.setProcessedHandler} 
          validateFileHandler={this.validateFileHandler}  isUploadedFiles={this.state.isUploadedFiles}/>
          <ToastContainer />
      </div>

1 Ответ

0 голосов
/ 10 октября 2019

Попробуйте визуализировать div вместо тоста с красным цветом фона и шириной 200 пикселей.

...