react-app 项目初学（2）JSX语法

总的来说语法规则总结为以下几点：

下面就以一个TodoList的demo为例

1.在jsx里面法里可以写js表达式但是不可以写js语句

如果要动态生成html，那么就要用表达式表示：

2.render函数返回出去的内容只能是一个jsx,如果是两个就会报错

 

因该用一个大的div包裹变成一个jsx,

组件样式的两种构成：

（1）render(){}里定义,然后使用的时候内联样式写法 style={定义的样式名称}

（2）在组件的文件里新建一个.css文件，然后在js文件里import ‘./文件名’，组件中使用的时候className="样式名称",

如果在react里写内联样式，style={{width:‘60px’}}这样的样子，需要用两个花括号包起来。或者内联样式可以用一个变量代替，如下图，不过有个地方需要注意：每个样式之间逗号分隔；不是分号；每一个具体的样式都要用引号括起来。

jsx里面有时候你会看到一个这样的写法:{变量a&&(html结构)}

只有当变量a为true时，括号里面的html才显示，否则隐藏