08==》创建组件以 1类的形式 或者以 2函数的形式

09==》使用组件
在src下创建components文件夹 是放组件的
CompType.js 组件 组件开头大写(重要)
CompType.js文件如下 import React from "react" //一定要导入React
// 函数类型去创建组件
export function Web1(){
return <div>我是以函数的形式创建的组件</div>
} // 以类的形式创建组件
export class Web2 extends React.Component{
render(){
return <div>我是类组件</div>
}
}
使用组件
// 导入组件 在一个文件中导入了两个组件哈
import {Web1,Web2} from "./components/CompType" {/* 使用组件 */}
<Web1></Web1>
<Web2></Web2> 函数式组件与类组件的区别
函数式组件只负责 展示 不负责业务逻辑
类组件 负责负责的业务逻辑

React 以两种形式去创建组件 类或者函数(二)的更多相关文章

  1. C++:一般情况下,设计函数的形参只需要两种形式

    C++:一般情况下,设计函数的形参只需要两种形式.一,是引用形参,例如 void function (int &p_para):二,是常量引用形参,例如 void function(const ...

  2. 基于 Scrapy-redis 两种形式的分布式爬虫

    基于 Scrapy-redis 两种形式的分布式爬虫 .caret, .dropup > .btn > .caret { border-top-color: #000 !important ...

  3. Controller@实现Controller的两种形式

    实现Controller的两种形式 形式1:仅仅实现IController接口,自定义Controller对Request的实现.形式2:在实现IController接口以后,继承Controller ...

  4. jquery插件的两种形式

    这里总结一下jquery插件的两种形式,一种是通过字面量的形式组织代码,另一种是通过构造函数的方式.下面就两种形式来分析俩个例子. 例子1: ;(function ($,window,document ...

  5. SQL 关于apply的两种形式cross apply 和 outer apply(转)

    转载链接:http://www.cnblogs.com/shuangnet/archive/2013/04/02/2995798.html apply有两种形式: cross apply 和 oute ...

  6. SQL 关于apply的两种形式cross apply 和 outer apply

    SQL 关于apply的两种形式cross apply 和 outer apply 例子: CREATE TABLE [dbo].[Customers]( ) COLLATE Chinese_PRC_ ...

  7. SQL关于apply的两种形式cross apply和outer apply(转载)

    SQL 关于apply的两种形式cross apply 和 outer apply   apply有两种形式: cross apply 和 outer apply   先看看语法:   <lef ...

  8. 在 Perl看来, 字符串只有两种形式. 一种是octets, 即8位序列, 也就是我们通常说的字节数组. 另一种utf8编码的字符串, perl管它叫string. 也就是说: Perl只熟悉两种编

    在 Perl看来, 字符串只有两种形式. 一种是octets, 即8位序列, 也就是我们通常说的字节数组. 另一种utf8编码的字符串, perl管它叫string. 也就是说: Perl只熟悉两种编 ...

  9. 在sql中case子句的两种形式

    case子句,在select后面可以进行逻辑判断. 两种形式:判断相等.判断不等 一.判断相等的语法: case 列名 when ...  then ... when ...  then ... el ...

随机推荐

  1. JPA中实现单向多对一的关联关系

    场景 JPA入门简介与搭建HelloWorld(附代码下载): https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/103473937 ...

  2. Class文件结构-属性表

    一.属性表整体结构 二.属性表具体结构

  3. Redis面试篇 -- Redis常见性能问题和解决方案?

    master最好不要做任何的持久化工作,如RD内存快照或者AOF日志文件: 如果数据比较重要,某个slave开始AOF备份数据,策略设置为每秒同步1次: 为了主从复制的速度和连接的稳定性,master ...

  4. C#本地文件下载以及FTP文件服务下载(以Pdf文件为例)

    一.C#实现本地文件下载 1.文件下载的路径  文件名称 以及文件下载之后要放的位置  这三个变量是必须要的 2.定义以下四个对象: FileWebRequest ftpWebRequest = nu ...

  5. java编译报错: 找不到或无法加载主类 Demo.class 的解决方法

    原因:java 命令后面的文件不能有后缀名. 解决方法:运行java时候,后面的文件去掉后缀名.

  6. Centos7 下添加开机自启动服务和脚本

    1.添加开机自启服务 #设置jenkins服务为自启动服务 systemctl enable jenkins.service #启动jenkins服务 systemctl start jenkins. ...

  7. docker下MySQL的主从复制

    MySql的主从复制 sudo docker pull MySQL:5.7 拉取MySQL的镜像文件(版本号为 5.7) sudo docker run -p 3339:3306 --name mas ...

  8. 通过 Telegraf + InfluxDB + Grafana 快速搭建监控体系的详细步骤

    第一部分 Telegraf 部署和配置 Telegraf 是实现 数据采集 的工具.Telegraf 具有内存占用小的特点,通过插件系统开发人员可轻松添加支持其他服务的扩展. 在平台监控系统中,可以使 ...

  9. linux安装数据时报错Could not execute auto check for display colors using command /usr/bin/xdpyinfo.

    在redhat6.5上安装Oracle时,最后使用oracle用户执行runInstaller 报错如下,无法连接到安装有xmanager的windows服务器,也就无法图形化安装oracle ora ...

  10. 表单生成器(Form Builder)之伪造表单数据番外篇——随机车辆牌照

    前几天记录了一下表单生成器(Form Builder)之表单数据存储结构mongodb篇,之后便想着伪造一些数据.为什么要伪造数据呢?说来惭愧,因为拖拉拽设计表单以及表单对应的列表的PC端和移动端该显 ...