美文网首页
react组件构建写法

react组件构建写法

作者: MrAlexLee | 来源:发表于2019-05-24 11:04 被阅读0次

1,react.createClass,兼容性最好。一直都是react官方唯一指定的组件写法。

const Button = React.createClass({
    getDefaultProps(){
        return {
            color:'blue'
        }
    }
    
    render(){
        const {color} = this.props;
        
        return (
            <button className = {`btn-${color}`}>我是按钮</button>
        )
    }
})

在组件被调用时,会被解析成React.createElement(Button)方法来创建button实例。

2,ES6类-最常用的写法

用类来实现,调用类实现的组件会创建实例对象。react所有组件都继承自顶类React.Component。他的定义很简介,只是初始化了React.Component方法,声明了props,context,refs等。并且在原型上定义了setState和forceUpdate方法。

3,无状态组件。

没有state,没有生命周期方法。在适合的情况下,我们都应该且必须使用无状态组件,无状态组件不会在调用时创建新实例。它创建时始终保持了一个实例。避免了不必要的内存分配。做到了内部优化。

相关文章

  • react组件构建写法

    1,react.createClass,兼容性最好。一直都是react官方唯一指定的组件写法。 在组件被调用时,会...

  • react Hooks 中的基本钩子初识

    react v16.8 之前,组件的标准写法是类,redux 的作者列举出 使用类构建组件的缺点: 大型组件难拆分...

  • 组件分享之前端组件——用于从 JSON Schema 构建 We

    组件分享之前端组件——用于从 JSON Schema 构建 Web 表单的 React 组件react-jsons...

  • React开发相关资料

    React-Router 中文简明教程 总结 React 组件的三种写法 及最佳实践 [涨经验] React-UI组件

  • React概念

    介绍 React的核心思想是:封装组件。React大体包含下面概念: 组件React 应用都是构建在组件之上。上面...

  • React入门(二)

    三、React组件 React 组件基本上是由组件的构建方式、组件内的状态属性与生命周期方法组成 React.cr...

  • React Native - 01 - Hello World!

    React Native就像React,但它使用本地组件而不是Web组件作为构建块。因此,要理解React Nat...

  • 深入浅出React和Redux学习笔记(二)

    设计高质量的React组件 构建高质量的React组件的原则和方法: 划分组件边界的原则; React组件的数据种...

  • 初识react

    react 官网地址http://facebook.hithub.io/react/ 特点: 1、组件化(所有写法...

  • 3.组件

    React 组件 可以这么说,一个 React 应用就是构建在 React 组件之上的。 组件有两个核心概念: p...

网友评论

      本文标题:react组件构建写法

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