反应类型无效答案

【问题标题】：react type is invalid反应类型无效
【发布时间】：2018-09-20 05:55:05
【问题描述】：

先生们，我是 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>
        );
    }
};

【问题讨论】：

标签： reactjs ecmascript-6 textarea

【解决方案1】：

ReactDom.render 首先作为 jsx，所以通过 <TextAreaCounter text="Bob" /> 和 text 属性。

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

【讨论】：

【解决方案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"));

【讨论】：