react小记/基本语法/reactjs整理(持续更新)

目录

一、基本语法

二、一些踩坑

1. react-router v5和v6 的一些区别

一、基本语法

1. react依赖三个库

        react包含react所有核心代码

        react-dom渲染在不同平台的代码

        babel将jsx转成react代码工具

2. 官方文档React – A JavaScript library for building user interfaces

3. 在script中需要加上type="text/babel"，写jsx

4. 写在标签内的语法，

5. 写在标签内的点击事件语法，

6. render函数里面只有一个根标签

7. 在jsx中，null， undefined，false/true(boolean类型)，不显示，转化为空渲染在dom上，对以上类型进行转换可显示

8. 注释语法，{/*我是注释*/}

9. 在jsx中，不能将对象类型进行直接写在标签上，会报错

10. 单标签必须加/

11. 其他标签属性语法，

12. 绑定class名字语法，className，

13. 绑定style语法，red: "red" 

14. 点击事件，react默认传一个event

15. 写法选择,boolean值，当有值显示，无值不显示

不要使用这个，

尽量使用这个，

16. 数组条件渲染案例[1,2,3,4,5,6,7,8,9]，使用filter()和map()，截取采用clice()，累加reduce()

    {
        this.state.arr.filter(item => item % 2 === 0).map(i => <div>{i}div>)
    }