React（3）-创建组件

╰+哭是因爲堅強的太久メ 2022-11-01 10:47 155阅读 0赞

##### 代码示例 #####

<!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8" />
    		<title>Hello React!</title>
    		
    		<script src="https://www.w3cschool.cn/statics/assets/react/react.min.js"></script>
    		<script src="https://www.w3cschool.cn/statics/assets/react/react-dom.min.js"></script>
    		<script src="https://www.w3cschool.cn/statics/assets/react/babel.min.js"></script>
    	</head>
    	<body>
    		<div id="example"></div>
    		<script type="text/babel">
    		// 使用react穿件组件
    		var HelloMessage = React.createClass({
    			render:function(){
    				return <h1>Hello, world!</h1>;
    			}
    		})
    
    		ReactDOM.render(
    			<HelloMessage />,
    			document.getElementById('example')
    		  );
        </script>
    		<script type="text/javascript">
    			console.log(React);
    			console.log(ReactDOM);
    		</script>
    	</body>
    </html>

###### 使用 React.createClass ######

*  自定义的 React 类名以大写字母开头
 *  组件类只能包含一个顶层标签，否则会报错

发表评论取消回复

表情：

评论列表（有 0 条评论，155人围观）

还没有评论，来说两句吧...

相关阅读

相关创建自定义 React 星级评分组件

在本教程中，我们将构建一个自定义的 React 星级评分组件。这种类型的组件允许用户通过单击鼠标给某物打 1 到 5 星的评级。以下是完成的组件的外观和功能： ![在这

小鱼儿/ 2023年10月11日 23:12/ 0 赞/ 103 阅读

相关 react--学习笔记3（面向组件编程）

一、React面向组件编程注意：组件名必须首字母大写虚拟DOM元素只能有一个根元素虚拟DOM元素必须有结束标签面向对象----

Dear 丶/ 2023年03月02日 10:18/ 0 赞/ 20 阅读

相关 react创建一个组件（函数组件和类组件及区别）

函数组件和class组件 1、函数组件：编写 JavaScript 函数，返回一个react元素（组件名首字母要大写） function Welcome(pro

今天药忘吃喽~/ 2022年11月12日 15:59/ 0 赞/ 195 阅读

相关 React（3）-创建组件

代码示例 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" />

╰+哭是因爲堅強的太久メ/ 2022年11月01日 10:47/ 0 赞/ 156 阅读

相关 React 项目--创建组件（7）

创建组件在上一篇的博客中我们介绍了react中字符串的处理方式和字符串数组的处理方式，如需回顾: [https://blog.csdn.net/datouniao1/

冷不防/ 2022年09月03日 12:27/ 0 赞/ 173 阅读

相关 React 项目---class 创建组件 (11)

回顾 function 创建组件在前面的学习中，我们已经介绍了一种方法来创建组件利用function，这里我们一起来回顾一下 function Hello

短命女/ 2022年08月29日 00:18/ 0 赞/ 188 阅读

相关 react创建组件的方式

react创建组件的方式: （１）工厂（无状态）函数（最简洁，推荐使用） function Component() { return<h1>工厂（无

以你之姓@/ 2022年05月16日 11:43/ 0 赞/ 214 阅读

相关 C# 学习笔记3 - 创建组件

Part III Creating Components In this part: Implementing Properties to Access

朴灿烈づ我的快乐病毒、/ 2022年05月11日 11:58/ 0 赞/ 190 阅读

相关 react功能实现-组件创建

这里主要从两个角度来分析创建一个组件需要怎么做,一个是元素,一个是数据.整理向,大量借鉴,非原创. 1.渲染组件. 我们先明确一点,所有的元素都必须通过render方

「爱情、让人受尽委屈。」/ 2021年11月23日 17:10/ 0 赞/ 328 阅读

相关 react系列（3）组件创建、检测、移除和隐藏

在v16.x版本，创建组件的主要方法React.createClass被移除了，新的创建方法（ES5）如下： var createReactClass = requi

秒速五厘米/ 2021年09月14日 10:20/ 0 赞/ 302 阅读