Home  >  Article  >  Web Front-end  >  How to traverse an array using react

How to traverse an array using react

王林
王林forward
2021-01-07 13:41:383077browse

How to traverse an array using react

This article teaches you how to use React to traverse an array and generate an unordered list using array elements.

(Learning video sharing: react video tutorial)

Implementation source code

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>React遍历数组</title>
		<script type="text/javascript" src="../js/react.js" ></script>
		<script type="text/javascript" src="../js/react-dom.js" ></script>
		<script type="text/javascript" src="../js/browser.min.js" ></script>
		<script type="text/babel">
			var students = ["张三然","李慧思","赵思然","孙力气","钱流量"];
			
			ReactDOM.render(
				<ul>
					{
						students.map(function(username){
							return <li>{username}</li>
						})
					}
				</ul>,
				document.getElementById("ulLi")
			)
		</script>
	</head>
	<body>
		<div id="ulLi"></div>
	</body>
</html>

Running results:

How to traverse an array using react

The above is the detailed content of How to traverse an array using react. For more information, please follow other related articles on the PHP Chinese website!

Statement:
This article is reproduced at:csdn.net. If there is any infringement, please contact admin@php.cn delete