Блог

Итак, у меня есть эта всплывающая форма, созданная с использованием компонентов React-bootstrap. Я получаю эту ошибку на консоли:

Предупреждение: findDOMNode устарел в StrictMode. findDOMNode был передан экземпляр Transition, который находится внутри StrictMode. Вместо этого добавьте ссылку непосредственно к элементу, на который вы хотите ссылаться. Узнайте больше о безопасном использовании ссылок здесь: в div (созданном Modal) в Transition (созданном Fade) в Fade (созданном BackdropTransition) в BackdropTransition (созданном Modal) в Modal (созданном Modal) в Modal (в UpdateProfileForm.jsx:15) в UpdateProfileForm (в Profile.js:91) в div (созданном Row) в строке (в Profile.js:86) в div (созданном Card) в Card (в Profile.js:31) в div (созданном контейнером) в контейнере (в Profile.js:30) в Profile (созданном контекстом.Потребитель) в маршруте (в App.js: 31) в коммутаторе (в App.js: 24) в маршрутизаторе (созданном BrowserRouter) в BrowserRouter (в App.js: 21) в приложении (в src / index.js: 9) в StrictMode (в src/index.js: 8) но я действительно не знаю, как это решить. Справка

Это мой компонент всплывающей формы.

 import React from "react";
import { Modal, Button, InputGroup, Form, FormControl } from "react-bootstrap";

function CreateTeamForm(props) {
  return (
    <Modal
      {...props}
      size="lg"
      aria-labelledby="contained-modal-title-vcenter"
      centered
    >
      <Modal.Header closeButton>
        <Modal.Title
          id="contained-modal-title-vcenter"
          style={{ fontSize: "30px" }}
        >
          CREATE TEAM
        </Modal.Title>
      </Modal.Header>
      <Modal.Body>
        <h4 style={{ fontSize: "20px" }}>Team Information</h4>

        <InputGroup style={{ marginBottom: "1rem" }}>
          <InputGroup.Prepend>
            <InputGroup.Text>
              <i className="fas fa-users fa"></i>
            </InputGroup.Text>
          </InputGroup.Prepend>
          <FormControl id="Team Name" placeholder="Team Name" />
        </InputGroup>

        <InputGroup style={{ marginBottom: "1rem" }}>
          <InputGroup.Prepend>
            <InputGroup.Text>
              <i className="fas fa-user-plus"></i>
            </InputGroup.Text>
          </InputGroup.Prepend>
          <FormControl id="Members Emails" placeholder="Members Emails" />
        </InputGroup>
        <Form.Group controlId="Description">
          <Form.Label>Description</Form.Label>
          <Form.Control as="textarea" rows="3" />
        </Form.Group>
      </Modal.Body>
      <Modal.Footer>
        <Button onClick={props.onHide} variant="light">
          Close
        </Button>
        <Button className="btn--primary" variant="primary">
          CREATE
        </Button>
      </Modal.Footer>
    </Modal>
  );
}

export default CreateTeamForm;