Maison  >  Article  >  interface Web  >  Comment parcourir un tableau en utilisant React

Comment parcourir un tableau en utilisant React

王林
王林avant
2021-01-07 13:41:383081parcourir

Comment parcourir un tableau en utilisant React

Cet article vous apprend à utiliser React pour parcourir un tableau et générer une liste non ordonnée à l'aide d'éléments de tableau.

(Partage de vidéos d'apprentissage : Tutoriel vidéo React)

Code source d'implémentation

<!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>

Résultats d'exécution :

Comment parcourir un tableau en utilisant React

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer