тип реакции недействителен

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 prop.

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"));