react 数组_react-jsx和数组

JSX：

1.全称：JavaScriptXML，

2.react定义的一种类似于XML的JS扩展语法：XML+JS

3.作用：用来创建react虚拟DOM(元素)对象

var ele=

Hello,world!

注意：他不是一个字符串，也不是HTML/XML，它最终产生的就是一个JS对象

4.标签名/属性任意：HTML标签/属性或者其他标签/属性

5.基本语法规则：

遇到 < 开头的代码   以标签语法解析

遇到 { 开头的代码   以JS语法解析；标签中的JS必须用{}包裹起来

6.babel.js的作用

浏览器不能直接解析JSX代码，需要babel转译为JS代码才能运行；

在使用JSX代码之前加type=“text/babel”声明

将数据数组转化为标签数组：

work2

//将数据数组转换为标签数组，使用map方法

const ul=(

• {names.map((name,index)=>
• {name})}

);

reactDom.render(ul,document.getElementById("example1"))

这是个例子

效果：