React 以两种形式去创建组件 类或者函数(二)
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 以两种形式去创建组件 类或者函数(二)的更多相关文章
- C++:一般情况下,设计函数的形参只需要两种形式
C++:一般情况下,设计函数的形参只需要两种形式.一,是引用形参,例如 void function (int &p_para):二,是常量引用形参,例如 void function(const ...
- 基于 Scrapy-redis 两种形式的分布式爬虫
基于 Scrapy-redis 两种形式的分布式爬虫 .caret, .dropup > .btn > .caret { border-top-color: #000 !important ...
- Controller@实现Controller的两种形式
实现Controller的两种形式 形式1:仅仅实现IController接口,自定义Controller对Request的实现.形式2:在实现IController接口以后,继承Controller ...
- jquery插件的两种形式
这里总结一下jquery插件的两种形式,一种是通过字面量的形式组织代码,另一种是通过构造函数的方式.下面就两种形式来分析俩个例子. 例子1: ;(function ($,window,document ...
- SQL 关于apply的两种形式cross apply 和 outer apply(转)
转载链接:http://www.cnblogs.com/shuangnet/archive/2013/04/02/2995798.html apply有两种形式: cross apply 和 oute ...
- SQL 关于apply的两种形式cross apply 和 outer apply
SQL 关于apply的两种形式cross apply 和 outer apply 例子: CREATE TABLE [dbo].[Customers]( ) COLLATE Chinese_PRC_ ...
- SQL关于apply的两种形式cross apply和outer apply(转载)
SQL 关于apply的两种形式cross apply 和 outer apply apply有两种形式: cross apply 和 outer apply 先看看语法: <lef ...
- 在 Perl看来, 字符串只有两种形式. 一种是octets, 即8位序列, 也就是我们通常说的字节数组. 另一种utf8编码的字符串, perl管它叫string. 也就是说: Perl只熟悉两种编
在 Perl看来, 字符串只有两种形式. 一种是octets, 即8位序列, 也就是我们通常说的字节数组. 另一种utf8编码的字符串, perl管它叫string. 也就是说: Perl只熟悉两种编 ...
- 在sql中case子句的两种形式
case子句,在select后面可以进行逻辑判断. 两种形式:判断相等.判断不等 一.判断相等的语法: case 列名 when ... then ... when ... then ... el ...
随机推荐
- PHP实现微信扫码自动登陆与注册,参考实例
微信开发已经是现在phper必须要掌握的一项基本的技术了,其实做过微信开发的都知道微信接口非常的强大做起来也非常的简单,这里我们一起来看一个微信自动登陆注册的例子. php 微信扫码 pc端自动登陆注 ...
- 【CF528D】Fuzzy Search
Problem Description 你有一个长度为 \(n\) 的串 \(S\),以及长度为 \(m\) 的串 \(T\). 现给定一个数 \(k\) ,我们说 \(T\) 在 \(S\) 的位置 ...
- pillow模块Image.crop()函数切割图片方法,参数说明
使用Image.crop()方法对图片进行切割. 参数: Image.crop(left, up, right, below) left:与左边界的距离 up:与上边界的距离 right:还是与左边界 ...
- JPA中实现单向多对一的关联关系
场景 JPA入门简介与搭建HelloWorld(附代码下载): https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/103473937 ...
- js Set对象
1.将数组转换成Set对象 let arr1 = new Set([1,2,3,4]) console.log(arr1) //{1,2,3,4} 2.数组去重 let arr2 = new Set( ...
- [转]UiPath Invoke Code
本文转自:https://dotnetbasic.com/2019/08/uipath-invoke-code.html We will learn step by step tutorial for ...
- WebSessionStore: Could not obtain reference to HttpContext
IBatis.net在多线程中报错“WebSessionStore: Could not obtain reference to HttpContext” 分析: 因为ibatis的ISqlMapSe ...
- jsp + js + 前端弹出框
在项目中,前端页面我们时常需要各种各样的弹出框: 1.alert对话框:显示含有给定消息的"JavaScript Alert"对话框 代码: var a = "Hello ...
- [转]Python十个高大上的语法
Python 是一种代表简单思想的语言,其语法相对简单,很容易上手.不过,如果就此小视 Python 语法的精妙和深邃,那就大错特错了.本文精心筛选了最能展现 Python 语法之精妙的十个知识点,并 ...
- SQL Server查看login所授予的具体权限
在SQL Server数据库中如何查看一个登录名(login)的具体权限呢,如果使用SSMS的UI界面查看登录名的具体权限的话,用户数据库非常多的话,要梳理完它所有的权限,操作又耗时又麻烦,个人十分崇 ...