当我在index.js上导入类时,“元素类型无效:需要一个字符串”

时间:2019-05-11 05:35:13

标签: javascript reactjs jsx

我知道

  

元素类型无效:预期为字符串(对于内置组件)或类/函数(对于复合组件),但得到了:对象。   我无缘无故访问React应用

   6 | import "bootstrap/dist/css/bootstrap.css";
   7 | import Counter from "./components/counter";
   8 | 
>  9 | ReactDOM.render(<Counter />, document.getElementById("root"));
  10 | 
  11 | // If you want your app to work offline and load faster, you can change
  12 | // unregister() to register() below. Note this comes with some pitfalls.

即使我已经导出并导入了类,它仍提示第9行

1 个答案:

答案 0 :(得分:0)

要使用导入,您必须使用像这样的导出默认关键字,或者在必须使用的文件中导出多对象

import { Counter } from "./component/counter";

我的示例如何使用导出默认关键字

import React from "react";
import PropTypes from "prop-types";

const ACCInput = props => {
  const className = "form-control";
  const classNameError = "form-control is-invalid";

  return (
    <div className="form-group">
      <label htmlFor={props.name} hidden>
        {props.name}
      </label>
      <div>
        <input
          className={props.className ? classNameError : className}
          id={props.id}
          type={props.type}
          name={props.name}
          placeholder={props.placeholder}
          onFocus={props.onFocus}
          onChange={props.onChange}
          onBlur={props.onBlur}
          value={props.value}
          disabled={props.disabled}
        />
      </div>
    </div>
  );
};

ACCInput.propTypes = {
  className: PropTypes.bool,
  id: PropTypes.string,
  type: PropTypes.string,
  name: PropTypes.string,
  placeholder: PropTypes.string,
  value: PropTypes.string,
  onChange: PropTypes.func,
  onBlur: PropTypes.func,
  onFocus: PropTypes.func,
  required: PropTypes.string,
  disabled: PropTypes.string
};

export default ACCInput;