Question

先生，我是React的新手。我收到错误消息：警告：React.createElement：类型无效-预期为字符串（对于内置组件）或类/函数

我的代码：

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';

ReactDOM.render(
    React.createElement(TextAreaCounter, {
    name: "Bob",
    }),
    document.getElementById("app")
);

export class TextAreaCounter extends React.Component{
    static propTypes= {
    text: React.PropTypes.string,
    }
    getDefaultProps = {

            text: '',

    }
    render() {
        return(
        <div>
            <textarea defaultValue = {this.props.text}></textarea>
            <h3>this.props.text.length</h3>
        </div>
        );
    }
};

Answer 1

ReactDom.render首先作为jsx，因此将<TextAreaCounter text="Bob" />与text属性一起传递。

ReactDOM.render(<TextAreaCounter text="Bob" />, document.getElementById("app"));

Answer 2

请尝试给出以下代码

import React from "react";
import ReactDOM from "react-dom";
import PropTypes from "prop-types";
import "./index.css";

class TextAreaCounter extends React.Component {
  static propTypes = {
    text: PropTypes.string
  };
  getDefaultProps = {
    text: "dfgfdg"
  };
  render() {
    return (
      <div>
        <textarea defaultValue={this.props.text} />
        <h3>{this.props.text}</h3>
      </div>
    );
  }
}

ReactDOM.render(<TextAreaCounter />, document.getElementById("root"));

反应类型无效

2 个答案: