Проверьте метод рендеринга `Drawer`. Недопустимый тип элемента - PullRequest
Новая
       17

Проверьте метод рендеринга `Drawer`. Недопустимый тип элемента

0 голосов
/ 29 августа 2018

В моем проекте я использую реагирующие библиотеки js и antd.design. я пытаюсь использовать компонент DRAWER, но я получил ошибку: Тип элемента недопустим: ожидал строку (для встроенных компонентов) или класс / функцию (для составных компонентов), но получил: object.

Проверьте метод рендеринга Drawer.

проблема с компонентом Drawer, когда я удаляю его, проект запускается без ошибок, когда я добавляю его, снова появляется ошибка

это мой код: 

import PropTypes from "prop-types";
import { withStyles } from "@material-ui/core/styles";
import "antd/dist/antd.css";
import React from "react";
import "antd/dist/antd.css";
import { Drawer, Button } from "antd";
import Stepper from "../addExperience/stepper";
import { Icon } from "antd";
import ElementClass from "./DrawerElement"
const IconText = ({ type, text }) => (
  <span>
    <Icon type={type} style={{ marginRight: 8 }} />
    {text}
  </span>
);
 class MyClass extends React.Component {
  state = { visible: false };

  showDrawer = () => {
    this.setState({
      visible: true
    });
  };

  onClose = () => {
    this.setState({
      visible: false
    });
  };

  render() {
    return (
      <div>
        <a style={{ color: "#A6A6A6" }} onClick={this.showDrawer}>
          {" "}
          <IconText type="edit" text="Modifier" />{" "}
        </a>
          <Drawer
          title="Modifier cette experience"
          width={720}
          placement="right"
          onClose={this.onClose}
          maskClosable={false}
          visible={this.state.visible}
          style={{
            height: "calc(100% - 55px)",
            overflow: "auto",
            paddingBottom: 53
          }}
        >
          <Stepper />
          <div
            style={{
              position: "absolute",
              bottom: 0,
              width: "100%",
              borderTop: "1px solid #e8e8e8",
              padding: "10px 16px",
              textAlign: "right",
              left: 0,
              background: "#fff",
              borderRadius: "0 0 4px 4px"
            }}
          >
            <Button
              style={{
                marginRight: 8
              }}
              onClick={this.onClose}
            >
              Cancel
            </Button>
            <Button onClick={this.onClose} type="primary">
              Mettre à jour
            </Button>
          </div>
        </Drawer>  
      </div>
    );
  }
}

MyClass.propTypes = {
  classes: PropTypes.object.isRequired
};

export default withStyles()(MyClass);

1 Ответ

0 голосов
/ 30 августа 2018

Я думаю, что ваша проблема в том, что вы заключаете некоторые аргументы в {}, что делает предоставленное значение объектом, а не ожидаемым типом данных.

Проверьте документацию API , которая, например, говорит, что width хочет тип данных, который string|number означает строку или число. Вы указали {720}, который является объектом. Убедитесь, что все ваши аргументы используют правильные типы данных.

...