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. 破解另一家网站的反爬机制 & HMAC 算法

    零.写在前面 本文涉及的反爬技术,仅供个人技术学习,禁止并做到: 干扰被访问网站的正常运行 抓取受到法律保护的特定类型的数据或信息 搜集到的数据禁止传播.交给第三方使用.或者牟利 如有可能,在爬到数据 ...

  2. 详解串行通信协议及其FPGA实现

    前言 好久没更新博客了,这篇文章写写停停,用了近一周的时间,终于写完了.本篇文章介绍,串口协议数据帧格式.串行通信的工作方式.电平标准.编码方式及Verilog实现串口发送一个字节数据和接收一个字节数 ...

  3. 教你用python假装黑客装逼,当着朋友的面破解他的网站密码!

    如何破解iphone登陆密码 今天看了一篇关于如何破解iphone手机密码的文章,瞬间觉得科学技术不是第一生产力,why? 根据“可靠消息”称,即便美国FBI也无法轻易的对iphone手机进行暴力破解 ...

  4. tf读取图片,matplotlib可视化

    代码: """ 使用tf读取图片 """ import tensorflow as tf import matplotlib.pyplot ...

  5. The Library:2 Vulnhub Walkthrough

    主机层面扫描探测: ╰─ nmap -p1-65535 -sV -A 10.10.202.132 Starting Nmap 7.70 ( https://nmap.org ) at 2019-08- ...

  6. 记录/objc2/object_setClass做了啥

    inline Class objc_object::changeIsa(Class newCls) { // This is almost always true but there are // e ...

  7. OpenTSDB 简单使用 .NET

    OpenTSDB是基于Hbase的时序数据库[时间序列数据库].不具备通用性,主要针对具有时间特性和需求的数据,如监控数据.温度变化数据等. 1.安装OpenTSDB 安装前一定要安装HBase,相关 ...

  8. MATLAB聚类有效性评价指标(外部 成对度量)

    MATLAB聚类有效性评价指标(外部 成对度量) 作者:凯鲁嘎吉 - 博客园 http://www.cnblogs.com/kailugaji/ 更多内容,请看:MATLAB: Clustering ...

  9. 【RTOS】基于V7开发板的最新版RTX4 V4.81.1程序模板,不使用CMSIS-RTOS封装层,继续保持超强战斗力

    模板下载: 链接:https://pan.baidu.com/s/1idoQYcR3SOzVC3KTFcMGMA   提取码:i8k5 1.MDK使用MDK5.26及其以上版本. 2.进入到MDK5后 ...

  10. RK3399安装Qt

    更新软件源.升级软件 sudo apt-get update sudo apt-get upgrade 安装Qt sudo apt-get install qt5-default sudo apt-g ...