网页大神经

什么是组件化开发？ 不把页面逻辑写在一个jsx文件中，根据页面结构和复用度将页面结构拆分成不同的组件，由组件组成页面。 组件化开发是一种分而治之的思想，页面拆分组件，组件管理自己内部逻辑。被多处使用。

create-react-app脚手架把webpack等配置文件全部隐藏，具体是在react-scripts中。如果我们想要查看或者修改，有两种方式： 方式一：node_modules下修改： 方式二

脚手架使用背景 前端开发应用不再是单一的简单页面，是大型应用。 开发过程来说：多人协作，模块化开发，模块之间通过引用的形式，做到开发互不干扰 开发技术来说：模块化用到es6的导入导出。css使用scs

数组操作方式： 数组作为state中一项,操作时，最好先浅拷贝一份，最后通过setState赋值为拷贝项。 切勿直接操作state中数组的值 组件render函数内条件渲染，可以分别抽取不同条件下的r

接上篇，通过React.crateElement创建出来的是一个reactElement对象，它是一个js Object类型的对象，在控制台打印，如下图，描述了节点之间的嵌套关系，形成了一个关于节点嵌

介绍JSX为何能让浏览器识别，渲染DOM和页面。 先看下JSX代码： 在组件的render函数中返回了html结构代码。 浏览器渲染结果： 真相是什么？ babel的功劳。babel把JSX代码通过R

案例：默认显示文案，点击按钮隐藏，再点击显示 思路：定义控制展示与否的state.show.点击按钮修改show.JSX内容依赖show展示。 现在讨论JSX依赖show展示的几种方式： 方式一： r

react条件渲染，使用和普通js代码一致，使用if(vue: v-if/v-show) 根据条件，给变量赋值，变量在render中使用 三元运算，适合简单内容展示 逻辑与 适合依赖接口返回的值作渲染

JSX中event对象，与传统event对象有点区别，react对浏览器的event对象做了包装。 bind传参数问题 存在这样的问题，实参第一位丢失，实参从第二位开始，依次赋值给函数形参第一位开始，