Пытаясь дать константу this.state в реагировать JSX - PullRequest
0 голосов
/ 04 июня 2018

Итак, я пытаюсь создать лайтбокс изображения внутри моего конста, но всякий раз, когда я пытаюсь установить состояние, он не позволяет мне, и вместо этого я получаю сообщение об ошибке, которое говорит, что 'isOpen' присваивается значение, но никогда не используется.

const LineItem = ({ currency, lineItem, model, prints, snapshot }) => {
  if (!lineItem) {
    return null;
  }
  const { estimates, itar, quantity, uri } = lineItem;
  this.state = {
    isOpen: false,
  };
  const { isOpen } = this.state;
  return (
    <Panel>
      <Col xs={12} sm={4}>
        <Row>
          <Col xs={10} xsOffset={1} lg={6} lgOffset={3}>
            <ModelThumbnail snapshot={snapshot} itar={itar} />
            <button
              type="button"
              onClick={() => this.setState({ isOpen: true })}
            >
              Open Lightbox
            </button>
            <Lightbox
              mainSrc={snapshot}
              onCloseRequest={() => this.setState({ isOpen: false })}
            />
          </Col>
        </Row>
    </Panel>
  );
};

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

1 Ответ

0 голосов
/ 04 июня 2018

Вы фактически нигде не используете isOpen!Вам не нужно определять константу для setState.

Но главная проблема в том, что вы пытаетесь изменить состояние в компоненте без состояния.Попробуйте преобразовать его в класс, расширяющий компонент из React.

https://reactjs.org/docs/react-component.html

...