Динамическое обновление компонента заголовка для всплывающей подсказки пользовательского интерфейса материала - PullRequest
0 голосов
/ 23 сентября 2019

Я использую компонент подсказки React Material UI.В частности:

render() {
    const {comment} = this.props;
    ...
    <Tooltip title={this.handleFlaggedComment(comment)}>
        <IconButton className={classes.tooltipIconButton} aria-label="Reported" href="">
            <ReportedIcon className={classes.reportedIcon} />
        </IconButton>
    </Tooltip>
    ...
}

Параметр handleFlaggedComment реализован следующим образом:

handleFlaggedComment = (comment) => {
    return (
      <Fragment>
        <div>
           REPORTED COUNT&nbsp;:&nbsp;{comment.reportedCount}
        </div>
      </Fragment>
   )
}

Предположим также, что существует mapStateToProps, который реализован как:

mapStateToProps(state) {
    return {
        comment: state.commentsList.currentComment
    }
}

Когда указанный числопереходит от 1 к 3, и я наведите курсор мыши на значок, чтобы отобразить подсказку, и я ожидаю, что в качестве сообщенного счета будет показано 3.Тем не менее, он показывает только 1, что было начальным значением

Есть ли способ обновить заголовок всплывающей подсказки и показать обновленный комментарий, в частности, правильный reportCount?

, давайте также предположим, что некоторыеДействие пользовательского интерфейса вызывает увеличение количества зарегистрированных отчетов.Например, щелкнув по значку, который увеличивает reportCount на 1, и он обновляет состояние в избыточном для currentComment

...