美文网首页
<四>React组件---创建组件类

<四>React组件---创建组件类

作者: 者薄 | 来源:发表于2017-05-01 00:07 被阅读0次

创建组件类的方式

图片.png

代码实现

  <body>
    <div id="hello">

    </div>
  </body>
  <script type="text/babel">
    /*
      创建一个组件类:
      1.React中的组件类和java中的一样,首字母大写,驼峰命名法规则
      2.在React中使用creacteClass方法创建组件类
      3.每个组件类必须实现自己的render方法,输出定义好的组件模板,返回值:null,false,组件模板
      4.注意:组件类只能包含一个顶层标签
    */
    //注意:React.createClass---atom软件自动提示的有问题
    var HelloMessage = React.createClass({
      render: function() {
        return <h1>haha</h1>;
      }
    });

    ReactDOM.render(
      <HelloMessage />,
      document.getElementById("hello")
    );
  </script>

运行结果

图片.png

相关文章

  • <四>React组件---创建组件类

    创建组件类的方式 代码实现 运行结果

  • React学习笔记_02

    React 组件和状态 react 组件 1,组件的两种创建方式1,函数组件2,类组件 1,函数组件:使用 JS ...

  • React Native 基础知识总结

    Component Component:组件,使用extends React.Component创建的类为组件。?...

  • React - 类组件创建

    React创建组件有两种方式 函数式组件 类组件函数式组件已经学过,现在看下类组件怎么写。 函数式组件和类组件区别...

  • 组件与props

    创建组件 函数式创建函数组件 ES6语法创建类组件 将组件渲染至页面 React约定,组件名称使用大写开头,如

  • React基础

    React包含react元素和react组件 react元素 react组件 react组件分为函数组件和类组件 ...

  • 如何创建React组件并发布到npm?

    实现步骤: 创建React组件项目; 创建测试项目并引用组件; 发布React组件到npm上; 一、创建React...

  • 《React精髓》实践笔记 - Chapter 3

    创建一个无状态的组件 创建组件就是三个步骤 调用React.createClass()创建一个组件类ReactCl...

  • 2020 动手写个 react (3)

    组件 组件可能是函数还可能是类,我们知道只要继承 Component 类就是 react 的组件。 创建一个函数,...

  • 来简单聊一聊React Hooks

    为什么会有Hooks?大家都知道React的组件创建方式,一种是类组件,一种是函数式组件,在React官方希望,组...

网友评论

      本文标题:<四>React组件---创建组件类

      本文链接:https://www.haomeiwen.com/subject/umfftxtx.html